<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>New Document </title>
<meta name="Generator" content="EditPlus" />
<meta name="Author" content="" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<script type="text/javascript" language="JavaScript">
<!--
var loopTimer = null;
var girdWidth = 100;//单元格宽度
var mainWidth = girdWidth * 10;//总宽度
var mainStep = 0;//主间隔
var timerStep = 1;//循环间隔
var scrollSpeed = 4;//滚动速度
var showWidth = 600;//显示宽度
//修正值
girdWidth = girdWidth / scrollSpeed;
function doMar(dir) {
if(dir == "left"){
mainStep = mainStep + 1;
if (mainStep < ((mainWidth - showWidth) / scrollSpeed)) {
if ((mainStep % girdWidth) == 0) {
document.all("scrollDiv").style.pixelLeft -= scrollSpeed;
clearInterval(loopTimer);
}else{
document.all("scrollDiv").style.pixelLeft -= scrollSpeed;
}
if (btnRight.disabled) btnRight.disabled = false;
}else{
clearInterval(loopTimer);
btnLeft.disabled = true;
document.all("scrollDiv").style.pixelLeft = 0 - (mainStep * scrollSpeed);
}
}
if(dir=="right"){
mainStep = mainStep - 1;
if(mainStep > 0){
if ((mainStep % girdWidth) == 0) {
document.all("scrollDiv").style.pixelLeft += scrollSpeed;
clearInterval(loopTimer);
}else{
document.all("scrollDiv").style.pixelLeft += scrollSpeed;
}
if (btnLeft.disabled) btnLeft.disabled = false;
}else{
clearInterval(loopTimer);
btnRight.disabled = true;
document.all("scrollDiv").style.pixelLeft = 0;
}
}
}
function RunMar(sDir) {
clearInterval(loopTimer);
loopTimer = setInterval("doMar('"+sDir+"')", timerStep);
}
// -->
</script>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><input type="button" id="btnRight" value="右移" onclick="javascript:RunMar('right');"" disabled="disabled" style="height:100px" /></td>
<td>
<div id="mainDiv" style="background:#333; left:0px; overflow:hidden; width:600px; height:100px;">
<div id="scrollDiv" style="width: 600px; position: absolute">
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="background: #999">
<tr>
<td><img src="" width="100" height="100" alt="1" /></td>
<td><img src="" width="100" height="100" alt="2" /></td>
<td><img src="" width="100" height="100" alt="3" /></td>
<td><img src="" width="100" height="100" alt="4" /></td>
<td><img src="" width="100" height="100" alt="5" /></td>
<td><img src="" width="100" height="100" alt="6" /></td>
<td><img src="" width="100" height="100" alt="7" /></td>
<td><img src="" width="100" height="100" alt="8" /></td>
<td><img src="" width="100" height="100" alt="9" /></td>
<td><img src="" width="100" height="100" alt="0" /></td>
</tr>
</table>
</div>
</div>
</td>
<td><input type="button" id="btnLeft" value="左移" onclick="javascript:RunMar('left');" style="height:100px" /></td>
</tr>
</table>
</body>
</html>
联系客服
