Cet article vous présente principalement le code simple de jquery pour obtenir un effet de glissement. Il est très bon et a une valeur de référence. Les amis qui en ont besoin peuvent s'y référer.
JQuery implémente l'exemple de code de l'effet de glissement. Le code spécifique est le suivant :
<!DOCTYPE html>
<html>
<head>
<style>
p{ width:100px; height:100px; background:red; position:absolute;}
</style>
<script type="text/javascript" src="js/jquery-1.11.3.js"></script>
<script>
$(function(){
var disX = 0;
var disY = 0;
$('p').mousedown(function(ev){
disX = ev.pageX - $(this).offset().left;//获取鼠标到元素的left,top位置
disY = ev.pageY - $(this).offset().top;
$(document).mousemove(function(ev){
$('p').css('left',ev.pageX - disX);//获取移动后鼠标的位置，并重新赋值给元素
$('p').css('top',ev.pageY - disY);
});
$(document).mouseup(function(){
$(document).off();
});
return false;
});
});
</script>
</head>
<body>
<p></p>
</body>
</html>Recommandations associées :
Comment implémenter l'effet de glissement de la souris dans l'applet WeChat
Utiliser js pour implémenter un exemple d'effet de glissement div (compatible avec PC et mobile)
JS réalise l'effet de faire glisser div sur la page
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!
Que sont les plug-ins jquery ?
Comment faire fonctionner json avec jquery
Comment supprimer des éléments dans jquery
Utilisation de la méthode jQuery hover()
jquery implémente la méthode de pagination
Qu'est-ce qu'un élément caché dans jquery
Qu'est-ce qui est mis en évidence dans jquery
La différence entre passerelle et routeur
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
