此作品是浏览乐峰网的时候看到的，觉得效果很棒就把它整理出来分享给大家用，实现了带分页显示的明星专栏jquery特效，表面上看他用了很多张图片，实际上就用了2张，主要用样式来控件图片显示的位置background-position，这样的做法是现在前端设计这块的最常用的，好处就是减少对服务器的请求次数，提高性能，有空会整理这方面的jquery教程分享给大家的。。。。
核心的jquery代码如下：
var starHoverT;
$('#star').delegate('dl','mouseenter',function(){
clearTimeout(starHoverT);
var n = $('#star dl:visible').index($(this)),h = $(this).attr('h'),i=$(this).attr('i');
starHoverT = setTimeout(function(){
if($('#starHover').css('width') != '0px'){
var curY = $('#starHover').css('top').replace('px','');
var oneY = curY > n * 87 ? 24 : 10,
twoY = oneY == 10 ? 24 : 10;
$('#starHover').stop().animate({'top':n * 87 - oneY},100).animate({'top':n * 87 - twoY},100).animate({'top':n * 87 - 18},50);
}else{
$('#starHover').css({'top':n * 87 - 18}).html('<b></b>');
$('#starHover').animate({'width':226},200);
}
$('#starHover b').css('margin-top',i * -127).parent().attr('href',h);
},200);
});
效果如下：
如果您觉得本作品对您的学习有所帮助：
关键字：
分页插件 滑动插件 导航菜单 鼠标悬浮 悬停特效 选项卡