jquery - 在页面加载时为菜单设置动画

Question

当使用 jquery 加载文档时，我试图让我的 ul 菜单从页面左侧飞入。我该怎么做呢？谢谢您的帮助。

Answer 1

您可以使用jQuery.animate动画元素。

例子

$(document).ready(function(){
   $('ul').animate({left:'20px'},800);
});

我已经创建了其他DEMO供您查看。

Answer 2

从 Dipesh Parmar 开始，我制作了另一个工作演示，其中有一些关键区别：

1. 你想让它从右边来，然后向左滑动，看var startPos = 0 - objWidth;
2. 您可能希望它在离开页面之前停止，请参阅left: $(document).width() - objWidth - 15 将其移动到页面边缘，显示完整对象（加上一点填充）

由于演示对于您想要的内容可能有点过于复杂，所以这就是您所追求的代码归结为

var plane = $("#plane");
plane.css('left', plane.width()*-1); // Initially position the object off the page
plane.animate({
    left: $(document).width() - $("#plane").width() - 15 // Go to the right edge, show the whole object, and some padding
}, 3000, 'linear') // Action takes 3000 milliseconds in a linear motion

查看 jQuery 的动画文档了解更多http://api.jquery.com/animate/