I have created a small webpage, where I would like to animate content using jQuery during navigation. It's working perfectly in Internet Explorer. If I use Firefox it's not working properly.
My code is as follows
$("#maincontent").animate({"top":"450px"},800, function(){
$("#maincontent").html($("#"+Lidentity).html())
.animate({"top":"-10px"},600)
.animate({"top":"10px"},100)
.animate({"top":"-5px"},100)
.animate({"top":"5px"},100)
.animate({"top":"0px"},100);
});
I have set the #maincontent element position as absolute.
-
what actually happens in firefox? nothing? Do you have Firebug installed in Firefox? It will help you track down the error.Rik Heywood– Rik Heywood2009年07月02日 07:07:51 +00:00Commented Jul 2, 2009 at 7:07
1 Answer 1
If you're trying to make it look like it bounces with your animation, you're much better off using the easings from jQuery UI.
Example (based off your code):
$("#maincontent").animate({"top":"450px"},800, function(){
$("#maincontent").html($("#"+Lidentity).html())
.animate({"top":"0px"},800,"easeOutBounce");
});
Obviously for this to work you also need to add a reference to jQuery.UI (either the full bundle or at least effects.core.js & effects.bounce.js)