{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.xiaopingtou.cn//data/attach/topic/topicKPo7gB.jpg', '推荐 wuxianglin2000 的文章《js实现图片轮播，以及鼠标悬浮到图片时图片放大》','https://www.xiaopingtou.net/article-63752.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
图片轮播：
HTML代码：
<
>
js代码：
var curindex = 0; //当前页
var preindex = -1; //前一页
var licount; //计算图片数量
var timer;
$(function(){
$('ul.pic li:eq(0)').show().siblings('li').hide();
licount = $('ul.pic li').length;
timer = setInterval(autochange,5000);
$('#left').click(function(){ //左翻页
clearInterval(timer);
_index = (curindex == 0) ? licount-1 : curindex - 1;
movenext(_index);
})
.mouseout(function(){
timer = setInterval(autochange,5000);
})
$('#right').click(function(){ //右翻页
clearInterval(timer);
_index = (curindex == 1) ? licount-2 : curindex + 1;
movenext(_index);
})
.mouseout(function(){
timer = setInterval(autochange,5000);
})
})
function autochange(){
_index = (curindex + 1) % licount;
movenext(_index);
}
function movenext(_index){
preindex = curindex;
curindex = _index;
$('ul.pic li:eq('+ preindex +')').stop().fadeOut(1000);
$('ul.pic li:eq('+ curindex +')').stop().fadeIn(1000);
}
鼠标悬浮，图片变大：
html代码：
-
WX0201-XX均韵移门衣柜
-
WX0202-XX合和移门衣柜
-
WX0101-XX古典红移门衣柜
-
FZP-610YM爱慕茶白移门衣柜
-
FZP-606塞纳兰移门衣柜
-
FZP-610星辰云移门衣柜
// 鼠标悬浮到图片上时，图片变大，移走恢复原位
$(function(){
$(".ulimg").hover(function(){
$(this).css({
"width":'100%',
"height":'250px'
});
},function(){
$(this).css({
"width":'92%',
"height":'200px'
});
});
})