recherche

Maison >interface Web >js tutoriel >Exemple de partage de code simple pour JS afin d'obtenir un effet de tramage

Exemple de partage de code simple pour JS afin d'obtenir un effet de tramage

黄舟
黄舟original
2017-06-01 09:20:401438parcourir

Cet article se termine pour que tout le monde puisse obtenir l'effet de tramage via js Il est très bien et a une valeur de référence. Les amis intéressés peuvent s'y référer

Plus de bêtises, juste. allez directement j'ai posté le code pour tout le monde. Le code spécifique est le suivant : 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#p1 {
width: 100px;
height: 100px;
position: absolute;
left: 400px;
top: 200px;
background: red;
}
</style>
</head>
<body>
<p id="p1"></p>
<script>
var p1 = document.querySelector(&#39;#p1&#39;);
document.onclick = function () {
/*
* 抖动：
* 1. 每次改变一下元素的位置
* 按照一个中心点进行偏移，假设中心点left原始是400，那么每次就以left：400为中心做位置的移动
* 380 -> 420
* */
// p1.style.left = &#39;380px&#39;;
// p1.style.left = &#39;420px&#39;;
var a = true;
setInterval(function() {
/*
* 根据a的值，做不同的设置
* */
p1.style.left = (a ? 380 : 420) + &#39;px&#39;;
a = !a;
}, 30);
}
</script>
</body>
</html>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Exemple de partage de code montrant comment JS génère aléatoirement un code de vérificationArticle suivant：Exemple de partage de code montrant comment JS génère aléatoirement un code de vérification

Articles Liés

Voir plus