码迷,mamicode.com
首页 > 移动开发 > 详细

图片移动

时间:2016-10-31 09:15:45      阅读:209      评论:0      收藏:0      [点我收藏+]

标签:poi   point   20px   utf-8   height   rip   style   get   text   

<head>
<meta charset="utf-8" />
<title></title>
</head>
<style type="text/css">
.divv{
position: relative;
width: 400px;
height: 220px;
margin: 100px auto;
overflow: hidden;
cursor: pointer;
}
.divv2{
position: absolute;
width: 1330px;
height: 220px;
padding: 0;

}
.divv img{
position: relative;
}
</style>
<body>

<div id="div1" class="divv">
<div id="div2" class="divv2">
<img src="img/u=3381437764,4222561202&fm=21&gp=0.jpg" /><img src="img/u=3381437764,4222561202&fm=21&gp=0.jpg" />
</div>
</div>
</body>
</html>
<script>
num=10;
timr=null;
sum=30;
sum1=3
function $(id){
return document.getElementById(id);
}
$("div1").onmouseover=function(){
clearInterval(timr);


}

$("div1").onmouseout=function(){

timr=setInterval(function(){
num-=sum1;
if(num>=-930&&num<60){
$("div2").style.left=num+"px";
}else if(num<-930){
sum1=-50;
num=num+10;
return 0;
// $("div2").style.left=num+"px";

}else{
sum1=3
num=0;
return 0;
}

},sum)
}

图片移动

标签:poi   point   20px   utf-8   height   rip   style   get   text   

原文地址:http://www.cnblogs.com/zzzhangzheng/p/6014647.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!