Question

I am trying to insert a button that when clicked brings up a Google Form (which is tied to my fusion table). The button is in the upper right hand corner.

On my jsfiddle, the button works as expected and the div holding the Google Forms iframe pops up.

But when I move all the code to the server, the button ceases to work.

Here is the jsfiddle.

And here is the same code on the server. It now produces unexpected results.

$(document).ready(function() {

$('.button2').click(function() {

    type = $(this).attr('data-type');

    $('.overlay-container').fadeIn(function() {

        window.setTimeout(function(){
            $('.window-container.'+type).addClass('window-container-visible');
        }, 100);

    });
});

$('.close').click(function() {
    $('.overlay-container').fadeOut().end().find('.window-container').removeClass('window-container-visible');
});

});​

Can anyone provide some guidance as to what may be happening here and how I should approach this problem?

Answer 1

You have a zero width space(0xE2 0x80 0x8B) after you last semi-colon, it has no width so you cant see it. jsFiddle tends to add invisible Unicode characters to you code. Delete it and you’ll be fine.