首先非常感谢网友czqn8的无私分享，此作品是一款非常实用的jquery导航菜单，实现了滑动横向二级菜单jquery特效，功能非常简单，几行jquery代码就完成了，主要运用了jquery插件中的animate方法。。。
jquery实现代码如下：
$(function() {
var $t, leftX, newWidth;
$('.menu ul').append('<div class="block"></div>');
var $block = $('.block');
$block.width($(".current").width()).css('left', $('.current a').position().left).data('rightLeft', $block.position().left).data('rightWidth', $block.width());
$('.menu ul li').find('a').hover(function() {
$t = $(this);
leftX = $t.position().left;
newWidth = $t.parent().width();
$block.stop().animate({
left: leftX,
width: newWidth
},300);
}, function() {
$block.stop().animate({
left: $block.data('rightLeft'),
width: $block.data('rightWidth')
},300)
})
})
效果如下：
如果您觉得本作品对您的学习有所帮助：
关键字：
网友czqn8 导航菜单 滑动插件