jQuery 1.5.1 vs 1.4.4 weirdness
- by zobgib
I have been getting some weird errors when I upgrade jQuery from 1.4.4 to 1.5.1. Maybe you guys can explain what I need to change or why the new version is not working.
In 1.4.4 I have the following code
<div class="navlink home" data-link="home">
<span class="top">Home</span>
</div>
<div id="index-03">
</div>
<div class="navlink resume" data-link="resume">
<span class="top">Resume</span>
</div>
<div id="index-05">
</div>
<div id="index-06">
</div>
<div class="navlink portfolio" data-link="portfolio">
<span class="bottom">Portfolio</span>
</div>
JS:
$(".navlink").hover(
function () {
$(this).delay(100).animate({backgroundPosition: "-100% 0"}, 400);
$(this).find("span").css("textDecoration","underline");
},
function () {
$(this).queue("fx", []);
$(this).animate({backgroundPosition: "0% 0%"}, 400);
$(this).find("span").css("textDecoration","none");
}
);
Which works just fine.
but when I switch jQuery versions by changing this line in my header from
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
to
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
The above code quits animating and the background image just disappears.
Here is a jsFiddle that shows what's happening just change the jQuery version on the side between 1.4.4 and 1.5.1
http://jsfiddle.net/fUXZ4/ -- 1.4.4
http://jsfiddle.net/3APCd/ -- 1.5.1
Here is a video of exactly what is happening to me: http://img.zobgib.com/2011-03-07_1905.swf