Yup.
I’ll reply later. I’ve been a bit busy this morning.
I was able to reproduce your issue in IE8.
I’ve got to nip out now, but I can have a play with it this evening and I’ll get back to you soon.
Hi Forbes,
Can you open my demo page in IE, reload the page (important), then see if the FancyBox displays properly when you click on “Journey Planner”.
Exactly the same.
Can you check if the page is rendering in quirks mode in IE.
if it is can you try changing it to Standards Mode and trying again.
As a sign of my complete ignorance, what is quirks mode, and how would I check that?
Hi,
Quirks mode is explained here: http://en.wikipedia.org/wiki/Quirks_mode
To check if IE is in quirks mode you must press F12 to show the dev tools. This should add a toolbar to the bottom of your browser window. In the toolbar, the last item on the right allows you to specify the mode the page renders in.
As I mentioned earlier, I could reproduce your wrror on IE8. I changed it from Quirks mode to Standard and this made things work as expected.
Sorry for the short reply. I’m writing this from an iPad.
It’s working.
It was in IE9 standards, as I’m sure will be the case with the client.
But more importantly, the customers using the system will also certainly only be using the default settings.
Well that’s cool!
What did you do to get it working?
I’m not suggesting that the clients have to alter their settings, rather we have to code the document differently and have IE render it correctly out of the box.
Just re-read your post. Do you mean putting it in quirks mode made it work?
I first switched to Quirks Mode and then switched back to IE9 standards, which made it work. I repeated the process with my own version.
While this is a fix — of sorts — it’s not a workable solution. We can’t ask the customer to go through those steps, no matter how trivial they may be.
I have to go for a while (an evening run), but I’ll be back later.
Same thing happened with me.
Only problem is now that I cannot reproduce the error. Can you?
I ran the page through the W3 Validator and there were several errors.
My guess is that one of these is causing IE to balk.
I’ll have a look at these this evening and get back to you.
Enjoy your run 
OK, so I’ve made a few changes to my demo and now the page validates.
I’ve uploaded it here, so if possible you can compare it with the [URL=“http://hibbard.eu/blog/pages/forbes/index.html”]old version and see if the error has been resolved.
Sorry for the late reply.
No, it’s doing the same thing.
The weird thing is, if I launch the developer tools, it begins to work. But if I quit Internet Explorer and try again without launching the developer tools, then it doesn’t work.
It worked straight away with no problems.
Yay!
You won’t believe what the error was.
It was being caused by this line console.log("here"); in the following function:
$("#button").click(function(ev) {
console.log("here");
s = $("#post_code").val();
e = $('input[name=venue_id]:checked').attr('data-postcode')
ev.preventDefault();
$.fancybox(this, {
ajax: {
type : "POST",
data : 's=' + s + '&e=' + e
},
onComplete: function(){
initialize();
}
});
});
Just remove it and you’re good.
I think that has got to be the biggest face-palm moment of this year so far.
It’s common knowledge that console.log is bad news for IE, but until I spotted this, I was testing on three different machines and had to result to setting up a VM, just to be able to reproduce the error.
:headbang:
Hey, I’ve done similar countless times. As we know, Fancy Box is working fine elsewhere, so it had to be something in the JavaScript itself. I was attempting a code comparison, but the two documents were too different to work, or I may have dug that one out.
Anyway, this looks to have got things working, which is excellent.