window.onload?=?function(){
????var?returnHome?=?document.getElementById('return-home');
????var?returnLeft?=?document.getElementById('return-home-left');
????var?returnRight?=?document.getElementById('return-home-right');
????returnRight.onclick?=?function(){
????????startMove(0,10);
????};
????returnLeft.onclick?=?function(){
????????startMove(-250,-10);
????};
????var?timer?=?null;
????function?startMove(a,b){
????????var?returnHome?=?document.getElementById('return-home');
????????setInterval(function(){
????????????if(returnHome.offsetLeft?===?a){
????????????????clearInterval(null);
????????????}else{
????????????????returnHome.style.left?=?returnHome.offsetLeft?+?b?+"px";
????????????}
????????},30);
????}
};<!DOCTYPE?html>
<html>
????<head>
????????<meta?charset="utf-8">
????????<meta?http-equiv="X-UA-Compatible"?content="IE=edge">
????????<meta?name="viewport"?content="width=device-width,?initial-scale=1">
????????<title>返回首頁</title>
????????<link?href="./return-home.css"?rel="stylesheet">?<!--?/css樣式表?-->
????????<link?href="./icomoon-common/style.css"?rel="stylesheet">?<!--?/圖標(biāo)字體?-->
????</head>
????<body>
????????<!--?整個(gè)ul丟進(jìn)去?-->
????????<ul?id="return-home">
????????????<li?class="left?sidebar"?id="return-home-left">
????????????????<a?href="javascript:;">
????????????????????<span></span>?關(guān)
????????????????</a>
????????????</li>
????????????<li>
????????????????<a?href="#">
????????????????????<span></span>?首頁
????????????????</a>
????????????</li>
????????????<li>
????????????????<a?href="#">
????????????????????<span></span>?首頁
????????????????</a>
????????????</li>
????????????<li>
????????????????<a?href="#">
????????????????????<span?class="?icon-play"></span>?首頁
????????????????</a>''
????????????</li>
????????????<li>
????????????????<a?href="#">
????????????????????<span></span>?首頁
????????????????</a>
????????????</li>
????????????<li?class="right?sidebar"?id="return-home-right">
????????????????<a?href="javascript:;">
????????????????????<span></span>?開
????????????????</a>
????????????</li>
????????</ul>
????????<script?src="./return-home.js"></script>?<!--?/整段js代碼??-->
????</body>
</html>@charset?'UTF-8';
.return-home
{
????font-size:?0;
????position:?fixed;
????z-index:?999999;
????bottom:?5%;
????/*left:?calc(100%?/?6?-?100%);*/
????left:?-250px;
????display:?inline-block;
????overflow:?hidden;
????width:?300px;
????height:?50px;
????margin:?0;
????padding:?0;
????opacity:?.7;
????border:?0;
????background-color:?white;
}
.return-home?li
{
????font-size:?0;
????display:?inline-block;
????width:?50px;
????height:?100%;
????margin:?0;
????padding:?0;
????list-style:?none;
????border:?0;
}
.return-home?.sidebar
{
????background-color:?transparent;
}
.return-home?.sidebar?a
{
????color:?#666;
}
.return-home?li?a
{
????font-size:?14px;
????display:?inline-block;
????width:?100%;
????height:?100%;
????text-align:?center;
}
.return-home?li?a?span
{
????font-size:?24px;
????display:?inline-block;
????width:?100%;
????margin-top:?5px;
}
這段js代碼為什么會(huì)一直抖動(dòng)
madnesslin
2016-08-20 12:18:31
