ul { position: relative; width: 300px; height: 560px; float: left; } #bigul > ul > li:nth-child(even) { position: absolute; display: none; } #bigul > ul > li { width: 300px; height: 560px; float: left; } #aniu { position: relative; } #aniu > div { position: absolute; } #aniu > div:first-child{ left:-55px; top: -290px; display: inline-block; border-left: 6px solid #c2c2c2; border-top: 6px solid #c2c2c2; width: 37px; height: 37px; transform: rotate(-45deg); } #aniu > div:last-child{ left: 1210px; top: -290px; display: inline-block; border-right: 6px solid #c2c2c2; border-bottom: 6px solid #c2c2c2; width: 37px; height: 37px; transform: rotate(-45deg); } #aniu > div:first-child:hover{ border-left: 6px solid #ffcc00; border-top: 6px solid #ffcc00; } #aniu > div:last-child:hover { border-right: 6px solid #ffcc00; border-bottom: 6px solid #ffcc00; }

显示隐藏，结构一样 ul.append(list.first()); //ul追加到最后一个 ul.css("margin-left",0); //在每一次点击过后，margin-left初始化为零，为什么嘛要初始化呢？ 思考一下？ });//这样就向右无限循环了，就像队列一样 if (tick) { clearTimeout(tick); } //清除上一次定时器 tick = setTimeout(function () { $("#bright").click(); },30000); 定时器自动的部分 }); $("#bleft").click(function(){ list = ul.find("ul"); list.last().insertBefore(list.first()); // 当第一次点击时，把最后的搬到前面来， ul.css("margin-left",-300); ul.animate({ "margin-left": 0 },3000); //同样这个问题？？ if (tick) { clearTimeout(tick); } tick = setTimeout(function () { $("#bleft").click(); },3000); }); $("#bright").click(); //自动向右事件 });