<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>點(diǎn)擊按鈕讓DIV層彈性移動(dòng)特效</title>

<style type="text/css">

#div1{ background: #FFCC66; border:#FF6600 1px solid; height:100px; width:100px; position:relative; left:0px;}

</style>

<script type="text/javascript">

 var t=null;

 function startMove()

 {

  if(t)

  {

   clearInterval(t);

  }

  t=setInterval(move, 30);

 }

 var step=0;

 function move()

 {

  var odiv=document.getElementById("div1");

   step+=(100-odiv.offsetLeft)/50;

   step=step*0.98

  odiv.style.left=odiv.offsetLeft+step;

 }

</script>

</head>

<body>

<div id="div1">

</div>

<input type="button" value="移動(dòng)" onclick="startMove()"/>

</body>

</html>

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

js怎么終止程序return不行換jfslk
alert(3)就這么段程序，沒有寫在function中，想啊想，怎么終止js呢？jfslk也能達(dá)到一樣的效果(終止js程序)
2013-05-05
如何給ss bash 寫一個(gè) WEB 端查看流量的頁面
由于剛畢業(yè)的窮大學(xué)生，和朋友合租了一臺(tái)服務(wù)器開了多個(gè)端口提供 ss 服務(wù)，懶得配置 ss-panel，就使用了 ss-bash 來監(jiān)控不同端口的流量，但每次都要等上服務(wù)器才能看到流量使用情況，很麻煩，于是就寫了個(gè)簡(jiǎn)單的頁面來提供 WEB 訪問，具體內(nèi)容一起通過本文學(xué)習(xí)吧
2017-03-03
js封裝的textarea操作方法集合(兼容很好)
對(duì)應(yīng)用到對(duì)textarea處理的朋友可以參考下。控制的比較不錯(cuò)的代碼封裝。
2010-11-11
JavaScript中執(zhí)行上下文和執(zhí)行棧
這篇文章主要介紹了JavaScript中執(zhí)行上下文和執(zhí)行棧，執(zhí)行上下文是評(píng)估和執(zhí)行JavaScript代碼的環(huán)境的抽象概念，更多相關(guān)介紹，感興趣的朋友可以參考一下
2022-09-09
JS的IE和Firefox兼容性集錦
JS的IE和Firefox兼容性集錦...
2006-12-12
js實(shí)現(xiàn)拖動(dòng)模態(tài)框效果
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)拖動(dòng)模態(tài)框效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-07-07
聊聊鑒權(quán)那些事(推薦)
這篇文章主要介紹了聊聊鑒權(quán)那些事(推薦)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-08-08
淺談JavaScript中的this指針和引用知識(shí)
this是javascript的一個(gè)關(guān)鍵字，隨著函數(shù)使用場(chǎng)合不同，this的值會(huì)發(fā)生變化。但是總有一個(gè)原則，那就是this指的是調(diào)用函數(shù)的那個(gè)對(duì)象。接下來通過本文給大家介紹js中的this指針和引用，非常不錯(cuò)，需要的朋友參考下
2016-08-08
簡(jiǎn)述JavaScript提交表單的方式（Using JavaScript Submit Form）
這篇文章主要介紹了簡(jiǎn)述JavaScript提交表單的方式（Using JavaScript Submit Form）的相關(guān)資料,需要的朋友可以參考下
2016-03-03
javascript中類的定義方式詳解(四種方式)
這篇文章主要介紹了javascript中類的定義方式,結(jié)合實(shí)例形式較為詳細(xì)的分析了JavaScript中類的四種定義方式,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-12-12