jQuery is not working in IE

Question

i have a problem with running my jQuery scripts in Internet Explorer at my Wordpress sites. On Firefox and Chrome it is working smoothly, but IE does not want to play with me.

I think that this can be conflict in wordpress's jQuery because my script is working well on simple "$variables". I'am using "jQueryvariable" like they saying in http://wordpress.org/support/topic/using-jquery-in-own-plugins#post-687280 but in IE is still not working.

Anyone can tell me how to include my own jQuery files in wordpress properly?

Thank You very much for help.

---

function MoveItems() {
    jQuery('.container>div:first').animate({
        width: '0px'
    }, 1000, function () {
        var mine = jQuery(this);
        mine.parent().append(mine);
        jQuery(this).css({
            width: '120px'
        });
    });
    jQuery('#bands>h2:first').fadeTo(
    4000, 0, function () {
        var mine = jQuery(this);
        mine.parent().append(mine);
        jQuery(this).fadeTo(
        1, 1);
    });
};



jQuery(document).ready(function () {

    var timer = setInterval(MoveItems, 1000);

    jQuery('#sponsors').hover(function () {
        clearInterval(timer);
    }, function () {
        timer = setInterval(MoveItems, 1000);
    });

    jQuery('.sponsor').mouseover(function () {
        jQuery('img', this).animate({
            width: "200px",
            height: "200px",
            left: "-40px",
            top: "-40px"
        }, {
            queue: false,
            duration: 500
        });
    });

    jQuery('.sponsor').mouseleave(function () {
        jQuery('img', this).animate({
            width: "120px",
            height: "120px",
            left: "0px",
            top: "0px"
        }, {
            queue: false,
            duration: 500
        });
    });

});

Answer 1

OK i have the solution. There is a know error with jquery and ie8 (sometimes opera) in latest wordpress releases.

more about error here: https://wordpress.stackexchange.com/questions/10719/jquery-in-ie8-no-longer-works-after-3-1-upgrade

SOLUTION:

//Making jQuery Google API
function modify_jquery() {
    if (!is_admin()) {
        // comment out the next two lines to load the local copy of jQuery
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js', false, '1.6.1');
        wp_enqueue_script('jquery');
    }
}
add_action('init', 'modify_jquery');

Answer 2

IE doesn't like the way your assigning some of the variables. It could also be that IE thinks container is a global variable.

See if this helps. body can be any parent container of container.

function MoveItems() {
    jQuery('body').append('.container>div:first').animate({
        width: '0px'
    }, 1000, function () {
        var mine = jQuery(this);
        mine.parent().append(mine);
        jQuery(this).css({
            width: '120px'
        });
    });
    jQuery('body').append('#bands>h2:first').fadeTo(
    4000, 0, function () {
        var mine = jQuery(this);
        mine.parent().append(mine);
        jQuery(this).fadeTo(
        1, 1);
    });
}  //removed this semi colon based on error from jslint.

jQuery(document).ready(function () {
    var timer = setInterval(MoveItems, 1000);
    jQuery('#sponsors').hover(function () {
        clearInterval(timer);
    }, function () {
        timer = setInterval(MoveItems, 1000);
    });

    jQuery('.sponsor').mouseover(function () {
        jQuery('img', this).animate({
            width: "200px",
            height: "200px",
            left: "-40px",
            top: "-40px"
        }, {
            queue: false,
            duration: 500
        });
    });

    jQuery('.sponsor').mouseleave(function () {
        jQuery('img', this).animate({
            width: "120px",
            height: "120px",
            left: "0px",
            top: "0px"
        }, {
            queue: false,
            duration: 500
        });
    });

}); 

It sounds far fetched but I've seen the same error on Ie caused by registry problems corrupting the javascript engine.

If the code doesn't work see if you can try it on another computer running IE.

I also noticed you have mime type errors for all your javascript files. Might not be the cause of this problem but something else to take a look at.

Resource interpreted as Script but transferred with MIME type application/octet-stream.
wp-scriptaculous.js:-1Resource interpreted as Script but transferred with MIME type application/octet-stream.
prototype.js:-1Resource interpreted as Script but transferred with MIME type application/octet-stream.
effects.js:-1Resource interpreted as Script but transferred with MIME type application/octet-stream.
lightbox.js:-1Resource interpreted as Script but transferred with MIME type application/octet-stream.
jquery.js:-1Resource interpreted as Script but transferred with MIME type application/octet-stream.
jquery.cycle.all.min.js:-1Resource interpreted as Script but transferred with MIME type application/octet-stream.
ngg.slideshow.min.js:-1Resource interpreted as Script but transferred with MIME type application/octet-stream.
webtoolkit.sprintf.js:-1Resource interpreted as Script but transferred with MIME type application/octet-stream.
fergcorp_countdownTimer_java.js:-1Resource interpreted as Script but transferred with MIME type application/octet-stream.
blink2_backup.js:-1Resource interpreted as Script but transferred with MIME type application/octet-stream.

Answer 3

Enclose the part of Jquery that you think, might be conflicting with wordpress into

        jQuery.noConflict();
        (function($){

           // type your jquery here 

         })(jQuery) ;

see if it works.

Answer 4

Try to add this first :

jQuery(document).ready(function($) { // When the document (page) has finished loading.

alert("jQuery is working!"); // Shows a window displaying "jQuery is working!"

}); 

and see whether alert is display or not...If alert is display then its not jquery issue i think