大佬教程收集整理的这篇文章主要介绍了javascript – 如何使用jQuery在菜单上创建滑动动画？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link number 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link something 4</a></li>
<li><a href="#">Link 5</a></li>
</ul>
@H_262_2@还有一些jQuery(我知道我可以通过简单的css获得相同的效果：悬停)：
jQuery('ul li a').hover(function() {
jQuery('a').removeClass('active');
jQuery(this).addClass('active');
});
@H_262_2@另外,工作jsfiddle：
@H_262_2@http://jsfiddle.net/8EvhK/
@H_262_2@按钮背景在悬停时变为红色.我希望这个背景在我悬停时在这些按钮之间滑动和变换(宽度).
@H_262_2@怎么做那样的事情？我一直在寻找教程,但没有运气.
@H_262_2@非常感谢！
$('ul').append('<div id="slider"></div>');
@H_262_2@>在悬停任何菜单项时,将此新元素设置为触发事件的菜单项的水平位置和宽度.
$('ul li a').hover(function(){
var left = $(this).parent().position().left;
var width = $(this).width();
$('#slider').stop().animate({
'left' : left,'width' : width
});
});
@H_262_2@>将滑块重置为其初始状态.
var left = $('ul li:first-child a').parent().position().left;
var width = $('ul li:first-child a').width();
$('#slider').css({'left' : left,'width' : width});
@H_262_2@>添加一些CSs.
#slider { position:absolute; top: -5px; left: 0; height: 100%; width: 0; padding: 5px 15px; BACkground-color: #f00; z-index:-1; }@H_262_2@这是一个工作小提琴：http://jsfiddle.net/5wPQa/2/
以上是大佬教程为你收集整理的javascript – 如何使用jQuery在菜单上创建滑动动画？全部内容，希望文章能够帮你解决javascript – 如何使用jQuery在菜单上创建滑动动画？所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。