原生javascript實現(xiàn)勻速運動動畫效果
更新時間：2016年02月26日 14:13:24 投稿：lijiao
這篇文章主要為大家詳細介紹了原生javascript實現(xiàn)勻速運動動畫效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文向大家介紹一個javascript實現(xiàn)的動畫。點擊開始按鈕div會往右移動，點擊停止后，div停止移動，再點擊則繼續(xù)移動。請看下面代碼：
<html>
<head>
<meta charset="gb2312">
<head>
<title>javascript實現(xiàn)的簡單動畫</title>
<style type="text/css">
#mydiv
{
width:50px;
height:50px;
background-color:green;
position:absolute;
}
</style>
<script type="text/javascript">
window.onload=function()
{
var mydiv=document.getElementById("mydiv");
var start=document.getElementById("start");
var stopmove=document.getElementById("stopmove");
var x=0;
var flag;
function move()
{
x=x+1;
mydiv.style.left=x+"px";
}
start.onclick=function()
{
clearInterval(flag);
flag=setInterval(move,20);
}
stopmove.onclick=function()
{
clearInterval(flag);
}
}
</script>
<body>
<input type="button" id="start" value="開始運動" />
<input type="button" id="stopmove" value="停止運動" />
<div id="mydiv"></div>
</body>
</html>
效果圖：
以上就是本文的全部內(nèi)容，希望對大家學習javascript程序設(shè)計有所幫助。
相關(guān)文章
這篇文章主要介紹了javascript原始值和對象引用的方法,實例分析了javascript原始值和對象引用的功能、定義與相關(guān)技巧,需要的朋友可以參考下2015-04-04
處理HTML DOM文檔存在一個難題是，JavaScript可以在DOM完全加載之前執(zhí)行，這會給你的代碼引發(fā)不少的潛在問題;針對這個問題，本文給予適當?shù)慕鉀Q方法，僅供參考2012-11-11
JScript內(nèi)置對象Array中元素的刪除方法...2007-03-03
Nick Justice是GitHub開發(fā)者計劃的一員。早在ES6語言標準發(fā)布之前，他就借助像Babel這樣的轉(zhuǎn)譯器以及最新版本的瀏覽器在自己的項目中使用ES6特性。他認為，ES6的新特性將極大地改變JavaScript的編寫方式2016-03-03
這篇文章主要介紹了JS煙花背景效果實現(xiàn)方法,實例分析了javascript操作dom元素實現(xiàn)煙花特效的技巧,需要的朋友可以參考下2015-03-03
WebGL 透明處理方式之一是使用 α 混合，這篇文章主要介紹了JavaScript?WebGL?圖片透明處理方式,本文給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-01-01
在web開發(fā)中，防止表單的重復提交是一個非常重要的環(huán)節(jié)。重復提交會導致數(shù)據(jù)混亂，甚至可能導致系統(tǒng)崩潰，今天我們將帶領(lǐng)大家從小白級別到大神級別的程序員，一起來學習如何在實際項目中避免表單的重復提交2023-04-04
這篇文章主要為大家詳細介紹了js實現(xiàn)圖片放大并跟隨鼠標移動特效，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-01-01
js window.onload 加載多個函數(shù)的方法
平時做項目 經(jīng)常需要使用window.onload，但window.onload 不能同時加載多個函數(shù)。2009-11-11
javaScript 動態(tài)訪問JSon元素示例代碼
訪問JSon元素的方法有很多，在搜的時候會找到很多，本文使用javascript來動態(tài)訪問json元素，感興趣的朋友可以練練手哦2013-08-08