JS滚动展示，左右方向按钮
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://luxury.bjhoutai.com/js/jquery-1.8.2.min.js"></script>
</head>
<style>
*{ padding:0px; margin:0px; border:0px;}
#mrt,#mrt dl{ overflow:hidden; height:160px;}
#mrt dl{ position:relative; left:0px;}
span{width:35px;height:160px; display:block;}
img{width:230px; height:160px;}
span,dd,#mrt{float:left}
</style>
<body>
<span id=‘left‘>左</span>
<div id="mrt">
<dl>
<dd><a href="#" target="_blank"><img src=‘http://luxury.bjhoutai.com/images/ad_auto.jpg‘ /></a></dd>
<dd><a href="#" target="_blank"><img src=‘http://luxury.bjhoutai.com/images/ad_home.jpg‘ /></a></dd>
<dd><a href="#" target="_blank"><img src=‘http://luxury.bjhoutai.com/images/ad_nba.jpg‘ /></a></dd>
<dd><a href="#" target="_blank"><img src=‘http://luxury.bjhoutai.com/images/ad_stock.jpg‘ /></a></dd>
<dd><a href="#" target="_blank"><img src=‘http://luxury.bjhoutai.com/images/ad_home.jpg‘ /></a></dd>
<dd><a href="#" target="_blank"><img src=‘http://luxury.bjhoutai.com/images/ad_nba.jpg‘ /></a></dd>
</dl>
</div>
<span id=‘right‘>右</span>
<script>
var time = 0;
var num = 6;
var width = 230;
var height = 160;
document.getElementById(‘mrt‘).style.width = num*width/2+"px";
document.getElementById(‘mrt‘).getElementsByTagName(‘dl‘)[0].style.width = num*width+"px";
var Auto=setInterval("move()",5000);
function move(){
if(parseInt($("#mrt dl").css(‘left‘)) <= 0 && parseInt($("#mrt dl").css(‘left‘))>-690){
$("#mrt dl").animate({
left:‘-=230px‘
},500);
}else{
$("#mrt dl").animate({
left:‘0px‘
},500);
}
}
$(‘#left‘).click(function(){
if(time == 0){
time = 1;
setTimeout("test()",500);
if(parseInt($("#mrt dl").css(‘left‘)) <= 0 && parseInt($("#mrt dl").css(‘left‘))>-690){
$("#mrt dl").animate({
left:‘-=230px‘
},500);
}
}
});
$(‘#right‘).click(function(){
if(time == 0){
time = 1;
setTimeout("test()",500);
if(parseInt($("#mrt dl").css(‘left‘)) < 0 && parseInt($("#mrt dl").css(‘left‘))>=-690){
$("#mrt dl").animate({
left:‘+=230px‘
},500);
}
}
});
function test(){
if(time == 1){
time--;
}
}
$(‘#mrt dd‘).mouseover(function(){window.clearInterval(Auto);});
$(‘#mrt dd‘).mouseleave(function(){Auto = setInterval(‘move()‘,5000);});
</script>
</body>
</html>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
