<!doctype?html>
<html>
<head>
<meta?charset="utf-8">
<title>無標(biāo)題文檔</title>
<style>
*{?margin:0;?padding:0;}
#box{?width:400px;
??????height:50px;
??border-radius:?10px;
??line-height:?50px;
??text-align:?center;
??margin:?200px?auto;
??font-size:?20px;
??background:?black;
??position:?relative;}
#box?#span{-webkit-background-clip:?text;
???????????color:?rgba(255,255,255,1);
???-webkit-user-select:?none;
???????????background:?-webkit-linear-gradient(135deg,rgba(0,0,0,0)?0%,?rgba(0,0,0,0)?24%,?rgba(255,255,255,0.7)?25%,?rgba(255,255,255,0.7)?35%,?rgba(0,0,0,0)?36%,?rgba(0,0,0,0)?100%);}
??
#box?img{position:?absolute;?
?????????width:?60px;
?height:?50px;
?left:?0px;
?cursor:?pointer;
?top:?1px;
?display:?block;}
/*#box?#span:hover{background-position:100px?0,250px?0;}*/
</style>
<script>
?window.onload=function()
{
?var?oDiv1=document.getElementById('box');
?var?oDiv2=document.getElementById('img');
?var?oSpan=document.getElementById('span');
?var?obj=null;
?
?
?setInterval(function(){
?setInterval(function()
?{
???var?dis=200-oSpan.offsetWidth;
???if(dis<20)
???{
?var?time=oSpan.style.left=2+"px";
???}
?oSpan.style.transition="width?3s";
?
?
/* ?console("time");
*/ ?},1000)
?
?
?},5000);
?
?oDiv2.onmousedown=function(ev)
???{
??var?ev=ev||window.event;
??var?obj=oDiv2; ??
??
??var?disL=ev.clientX-this.offsetLeft;??
??window.onmousemove=function(ev)??
??{
?var?ev=ev||window.event;
?var?left=ev.clientX-disL;??
??if(left<0)
???left=0;
???
??if(left>oDiv1.offsetWidth-oDiv2.offsetWidth)
??
??left=oDiv1.offsetWidth-oDiv2.offsetWidth;
??obj.style.left=left+'px'; ??
??}
??
??
??
???}
??window.onmouseup=function()
??????{
??obj=null;
??}
???
}
?</script>
</head>
<body>
<div?id="box">
????????<strong><span?id="span">Slide?To?Unlock</span></strong>
????????<img?id="img"?draggable="false"??src="../滑動解鎖/img/arrow.png"/>
????</div>
</body>
</html>
為什么光斑不動哪里有錯誤了？
慕粉1462455617
2017-05-11 22:09:10
