Cet article décrit la méthode de JavaScript pour permettre à la couche DIV de se déplacer élastiquement en cliquant sur un bouton. Partagez-le pour votre référence. La méthode de mise en œuvre spécifique est la suivante:
Copiez le code comme suit: <! 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">
<adal>
<Title> Cliquez sur le bouton pour rendre la calque div flexible et les effets spéciaux mobiles </Title>
<style type = "text / css">
# div1 {background: # ffcc66; Border: # FF6600 1PX solide; hauteur: 100px; Largeur: 100px; Position: relative; à gauche: 0px;}
</ style>
<script type = "text / javascript">
var t = null;
fonction startmove ()
{
si (t)
{
ClearInterval (t);
}
t = setInterval (Move, 30);
}
var étape = 0;
Fonction Move ()
{
var odiv = document.getElementById ("div1");
étape + = (100-odiv.offsetleft) / 50;
étape = étape * 0,98
odiv.style.left = odiv.offsetleft + étape;
}
</cript>
</ head>
<body>
<div id = "div1">
</div>
<input type = "Button" value = "Move" onClick = "startmove ()" />
</docy>
</html>
J'espère que cet article sera utile à la programmation JavaScript de tous.