View Full Version : quirky animations, jQuery bugs?

Feb 6th, 2009, 05:40 AM

I've created a number of jQuery animations for a website that I'm creating, and I've noticed some inconsistent problems. I'm seeing a few bugs in FF, but mostly IE.

When using the show("explode") animation, the image pieces will appear as very small when the image is not cached. After reload, the animation works perfectly. I've tried preloading the image to fix this but it makes no difference.

I'm also using an animation that changes text color on rollover. If you roll the mouse over the menu items very fast, sometimes they get stuck in the middle of an animation, and you have to rollover them again to finish the sequence.

Are these just bugs that are part of the jQuery library? Can the be avoided? Am I doing anything wrong?

Here is a link (http://www.stephenshaheen.com) that includes both relevant animations.

Here's the relevant jQuery script:

function home_page_animation(front_image, title, menu){
var front_image_div = $(front_image);
var title_div = $(title);
var menu_div = $(menu);

menu_div.css({"opacity" : "0", "top" : "0"});
title_div.css({"opacity" : "0"});

front_image_div.show("explode", {}, 2500);
title_div.animate({"opacity" : "1"}, 4500,
$(this).animate({ "opacity" : "0"}, 2000, function(){
$(this).css({"display" : "none"});
menu_div.css({ "display" : "block"});
menu_div.animate({ "opacity" : "1", "top" : "70px" }, 2000);


function menu_rollover(){
$(".menu ul li a").hover( function(){
// "fontSize" : "1.2em",
"color" : "#1D69EF"
}, 500);
}, function(){
// "fontSize" : "1em",
"color" : "white"
}, 500);

BTW, when using the fontSize animation, things really go nuts in IE.

Feb 7th, 2009, 12:36 AM
Have you logged bugs on the JQuery's bug tracker?


Oct 26th, 2009, 09:53 PM
Thanks. Yes, I logged the bug quite some time ago. I'm assuming that the bug is arising from some conflict with another part of my code, but I can't isolate it.

Any ideas for a fix or workaround?

Oct 28th, 2009, 06:58 PM
That's the same behaviour I was experiencing, sadly the only alternative was to use a different framework. Prototype is excellent :)

Oct 28th, 2009, 08:18 PM
these are not bugs, it is poorly coded jquery is all.

rnd me
Oct 29th, 2009, 01:31 AM
why the empty object, that doesn't jive with http://docs.jquery.com/Effects/show

front_image_div.show("explode", {}, 2500)

Feb 12th, 2010, 04:42 PM
I'm not sure why I had that empty object in there. It may be an deprecated code (I made it a while ago) or just a mistake.

In either case, I've removed it and it hasn't changed the behavior.

Too bad... I was very excited for a moment.

I've upgraded this site to the most recent version of jQuery (although no new jQuery UI has been released). The problems persists.

Any new ideas?