标签:
<body>
<!--页面布局,图片左上边距设为0,设置绝对定位,给按钮足够的上边距,以免被覆盖-->
<div>
<img src ="wolf.jpg" id = "image" style = "position:absolute;top:0;left:0px"/>
<input type = "button" id = "slide" style= "margin-top:350px" value = "滑动"/>
</div>
<script>
window.onload = function(){
var img = document.getElementById("image");
var slideBtn = document.getElementById("slide");
var maxLeft = 700 ;
slideBtn.onclick = function(){
slideFun();
};
var b = 10;
var c = 10;//c=b
b = 20;
function slideFun(){
var endLeft = 300 ;
var slideTimer = setInterval(function(){
var imgLeft = img.style.left;
console.log("image left is " + (imgLeft));
var num = parseInt(imgLeft);
console.log( "parseInt(imgLeft):" + num )
if(parseInt(imgLeft) < endLeft){
console.log(parseInt(imgLeft));
if(parseInt(imgLeft) < maxLeft){
imgLeft = parseInt(img.style.left)+ 20 + "px";
img.style.left = imgLeft;
}else{
alert("已经滑动到最大值");
clearInterval(slideTimer);
}
}else{
clearInterval(slideTimer);
}
},10);
}
};
</script>
</body>
标签:
原文地址:http://www.cnblogs.com/sapho/p/4805383.html