首先非常感谢网友Null的无私分享，这是他的第二款原创作品，虽然效果不是很棒、很酷，但是很实用，实现鼠标悬浮切换的tab选项卡Jquery特效，在这里也鼓励大家向网友Null学习，他本来是搞后台程序的，不断自己去学习前端这块的知识，现在开始会写特效，大家一起加油哦。
实现的功能代码如下：
var TabbedContent = {
init: function() {
$(".tab_item").mouseover(function() {
var background = $(this).parent().find(".moving_bg");
$(background).stop().animate({
left: $(this).position()['left']
}, {
duration: 300
});
TabbedContent.slideContent($(this));
});
},
slideContent: function(obj) {
var margin = $(obj).parent().parent().find(".slide_content").width();
margin = margin * ($(obj).prevAll().size() - 1);
margin = margin * -1;
$(obj).parent().parent().find(".tabslider").stop().animate({
marginLeft: margin + "px"
}, {
duration: 300
});
}
}
$(document).ready(function() {
TabbedContent.init();
});
效果如下：
如果您觉得本作品对您的学习有所帮助：
关键字：
网友Null 选项卡 滑动插件 鼠标悬浮