Jquery works in every browser other than IE

Question

For IE this code worked and I did the IE comment that only IE can read..

<!--[if gt IE 6]>
<script type="text/javascript" 
        src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
{

    //--my code
    $(document).ready(function() 
    {
        $('.thumbnail').live("click", function() 
        {
            $('#mainImage').hide();
            $('#imageWrap').css('background-image', "url('ajax-loader.gif')");
            var i = $('<img />').attr('src',this.href).load(function() 
            {
                $('#mainImage').attr('src', i.attr('src'));
                $('#imageWrap').css('background-image', 'none');
                $('#mainImage').fadeIn();
            });
            return false; 
        });
    });
};


</script> <![endif]-->

For Every other browser this code worked...

<script type="text/javascript">
$(document).ready(function() {
    $('.thumbnail').live("click", function() {
        $('#mainImage').hide();
        $('#imageWrap').css('background-image', "url('ajax-loader.gif')");
        var i = $('<img />').attr('src',this.href).load(function() {
            $('#mainImage').attr('src', i.attr('src'));
            $('#imageWrap').css('background-image', 'none');
            $('#mainImage').fadeIn();
        });
        return false; 
    });
});


</script>

I got the working code, even though they each do something different, they do what I need them to do. The only thing is IE doesn't want to read the code to do what I need... What am I missing? Thanks in advance!

E is famous for caching. Delete your cached files and see what happens. — Shyju, May 16 '12 at 18:46
I did, nothing, I deleted all history too, still nothing. Is there a special way I need to do it with out admin privs? — Jakob, May 16 '12 at 18:52

score 4 · Answer 1 · answered May 16 '12 at 18:49

4

You've got too many closing braces in your IE6 version, see here:

});
}; <- delete me

Remove the }; and you should be good :)

Edit: You've also got a rogue { at the start too, get rid of that as well, it's here:

{ <- delete that!

//--my code
$(document).ready(function() 
{

answered May 16 '12 at 18:49

Mathew Thompson

55,877
15
127
148

1

Ah that's because you have a random `{` above the function! Just spotted that, get rid of that too. – Mathew Thompson May 16 '12 at 18:53

score 1 · Answer 2 · answered May 16 '12 at 18:51

1

Are the opening and closing braces on the outside of your document.ready() part of you code?

Remove the first

and also the last

};

You don't need to wrap everything in braces.

answered May 16 '12 at 18:51

ContextSwitch

2,830
6
35
51

score 0 · Answer 3 · edited May 23 '17 at 12:20

0

Swap these two around:

$('<img />').attr('src',this.href).load(function()

should be

$('<img />').load(function(){...}).attr('src',this.href)...

so that it will work in IE6-IE8 once the image is cached.

Reference to this answer: Check if dynamically loaded images are complete

edited May 23 '17 at 12:20

Community

1
1

answered May 16 '12 at 18:50

Kevin B

94,570
16
163
180

This doesn't seem to make a difference. – gen_Eric May 16 '12 at 18:52
@Rocket see the two fiddles in my answer there, one will work in IE8 with every load and the other will only work the first load. – Kevin B May 16 '12 at 18:54
I switch it talking about this right? ` ('background-image', "url('ajax-loader.gif')"); var i = `var i = $('').attr('src',this.href).load` (function() {` – Jakob May 16 '12 at 18:55
I was testing in Chrome, and it didn't matter, guess it would in IE. – gen_Eric May 16 '12 at 18:55
Yes Jakob, however it won't actually fix the issue you are having, matty's answer is what will make your code run. This will just fix a weird bug that you may have run into later if not fixed. – Kevin B May 16 '12 at 18:56
I used Matty's answer and now adding in yours but when I insert I have an error. – Jakob May 16 '12 at 19:04

Jquery works in every browser other than IE

3 Answers3