,表面上看他用了很多张图片,实际上就用了2张,主要用样式来控件图片显示的位置background-position,这样的做法是现在前端设计这块的最常用的,好处就是减少对服务器的请求次数,提高性能,还有就是时间长了,大图找不到了。
首先引用文件
<script type="text/javascript" src="js/jquery.min.js"></script>
核心代码
$('#star dl dt').each(function(i){
$(this).css('background','url(images/starimg.jpg) 0 ' + i * -61 +'px no-repeat').parent().attr('i',i);
});
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);
});
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791