$(document).ready(function () {
var img_now = 0;
var img_count = 3;//图片数量
var t = setInterval("$('#Button2').click()", 3000);//自动移动
$("#Button1").click(function () {//左移
img_now = (img_now + img_count - 1) % img_count;
moveto(img_now);
});
$("#Button2").click(function () {//右移
img_now = (img_now + 1) % img_count;
moveto(img_now);
});
$("#div_outer").mouseenter(function () {
$("#div_controls").fadeIn();
clearInterval(t);//清除定时器
});
$("#div_outer").mouseleave(function () {
$("#div_controls").fadeOut();
t = setInterval("$('#Button2').click()", 3000);//重启定时器
});
})
function moveto(i) {
var _left = -(i * 590);
$("#div_innerMove").animate({ "opacity": 0.3 }, 500);
$("#div_innerMove").animate({ "left": _left });//div左移
$("#div_innerMove").animate({ "opacity": 1 }, 500);
}
#div_innerMove {
width: 1800px;
position: relative;
}
#div_outer {
width: 590px;
height: 470px;
margin: 10px auto;
border: 1px solid green;
overflow: hidden; /*超出范围部分不显示*/
}
#Button1 {
float: left;
}
#Button2 {
float: right;
}
#div_controls {
position: relative;
top: -240px; /*相对位置向上移动*/
display: none;
}