jquery - 使用 .animate() jquery 制作动画

Question

我在 css 中有一个 Logo /标题

#logo2 {padding:43px 20px 0 20px; background:url(images/in_Store_Marketing.jpg) top right no-repeat;}

我正在尝试在 jquery 中使用 .animate() 使 Logo 来自屏幕的右侧并位于屏幕的左侧。使用上面的 css，它将图像设置在左侧，它应该在动画结束时的位置。

目前 jquery 看起来像这样

$(document).ready(function(){
     $('#logo2').animate(
     { right: "+=95%" }, 3000 );
});

HTML 看起来像这样

<div id="logo2" style="height:70px">

它目前什么都不做，没有动画……我错过了什么？你如何让它以这种方式工作做动画？

Answer 1

试试这个？

.logo {padding: 35px 15 px 0 15 px; background:url(images/Logo.jpg) top right no-repeat;}

注意我把左改成了右

并将 js 更改为:

$(document).ready(function(){ $('#alex').animate({ right: "+=95%" }, 3000); });

我已经在 jsfiddle 中为您编写了一个类似的示例，check it out

更新:

试试我的更新，它使用绝对定位的图像，将产生与背景图像相同的效果:

http://jsfiddle.net/tub3c/