溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
實現(xiàn)功能：
1、當點擊按鈕的時，移動頁面上的某個元素（有時間制作）
Jquery代碼：
<script type="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
if(flag){
flag = false;
flag2 = true;
$("#box").css("display","block").animate({left:"-=100px"});
setTimeout($("#box").animate({left:"+=20px"}),30);
setTimeout($("#box").animate({left:"-=20px"}),30);
setTimeout($("#box").animate({left:"+=10px"}),30);
setTimeout($("#box").animate({left:"-=0px"}),30);
}
});
$(".btn2").click(function(){
if(flag2){
flag2 = false;
flag = true
$("#box").css("display","block").animate({left:"+=100px"});
setTimeout($("#box").animate({left:"-=20px"}),30);
setTimeout($("#box").animate({left:"+=20px"}),30);
setTimeout($("#box").animate({left:"-=10px"}),30);
setTimeout($("#box").animate({left:"+=0px"}),30);
}
});
});
var flag = true;
var flag2 = false;
</script>
代碼解釋：
HTML代碼：
<body>
<div id="box" style="position:absolute; display:none; left:109px; top:42px; background:#999; height:50px; width:200px; margin:6px;">
</div>
<button class="btn1">Animate</button>
<button class="btn2">Reset</button>
</body>
-----上傳了源文件，有需要的自己下載下來看看吧！
免責聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。
