Changer le curseur sur une attente?

Question

donc je veux changer le curseur de

#sideBar ul li .template{ 
cursor:pointer; 
} 

à peut-être curseur: déplacer; lorsque l'utilisateur glisse ... y at-il quelque chose que je peux utiliser dans jQuery ou html pour que cela se produise maintenez le bouton de la souris

Answer 1

Au lieu de changer le css dans votre code javascript, gardez à changer juste une classe, qui mettra à jour votre élément avec autant de choses différentes que vous voulez. J'ai ajouté un pseudo-classe: hover parce que je ne suis pas sûr si cursor fonctionne sans elle.

En outre, live fonctionne pour tout élément ajouté dans le futur et bind ne le fait pas.

Css:

#sideBar ul li .template{ 
cursor:pointer; 
} 

#sideBar ul li .template.mouseDown:hover{ 
cursor:auto; /* or whatever cursor */ 
} 

Javascript:

$("#sideBar ul li .template").live("mousedown", function() { 
    $(this).addClass("mouseDown"); 
}).live("mouseup", function() { 
    $(this).removeClass("mouseDown"); 
}); 

Answer 2

Vous pouvez essayer de lier une modification de css à l'événement mousedown en utilisant jQuery. Et puis utilisez mouseup() pour changer le curseur lorsque l'utilisateur a fini de glisser.

.: par exemple

$(document).ready(function() { 
    $('#sideBar ul li .template').mousedown(function() { 
     $(this).css('cursor', 'move'); 
    }); 
    $('#sideBar ul li .template').mouseup(function() { 
     $(this).css('cursor', 'pointer'); 
    }); 
}); 

Answer 3

Essayez quelque chose comme ceci:

someFunc({ 
    onstart: function(){ 
    $(document.body).css('cursor', 'move'); 
    }, 

    onstop: function(){ 
    $(document.body).css('cursor', 'auto'); 
    } 
}); 

Où onstart doit être déclenchée lorsque le glissement commence, et onstop quand elle se termine.

---

Si vous créez une fonction glisser personnalisée, vous pouvez utiliser mousedown et mouseup événements:

$(el) 
    .mousedown(function(){ 
    $(this).css('cursor', 'move'); 
    }) 
    .mouseup(function(){ 
    $(this).css('cursor', 'auto'); 
    }); 

Answer 4

Bien sûr, vous pouvez certainement le faire. La fonction Jquery .mouseDown peut être définie en tant que gestionnaire, vous n'avez alors qu'à modifier le CSS. Heres un example

$('.someElement').mousedown(function() 
{ 
    $(this).css('cursor', 'move'); 
}); 
$('.someElement').mouseup(function() 
{ 
    $(this).css('cursor', 'pointer'); 
}); 

Answer 5

Je ne vais pas répéter essentiellement les mêmes autres ont posté un code, mais un frein appropriée ne doit pas être déclenchée sur simple mousedown un événement.

Sur mousedown, vous devez marquer un glissement possible et enregistrer les coordonnées de la souris où le mousedown s'est produit, puis attacher un gestionnaire mousemove. (De cette façon, vous ne suivez pas constamment les mouvements de souris lorsque vous ne les intéressez que pendant un glisser)

Le gestionnaire de mousemove ne doit modifier la classe CSS de l'élément déplacé que lorsque la distance entre les coordonnées de mousedown enregistrées et le les coordonnées actuelles de la souris sont supérieures à certains delta. Cela empêche tout clic bref/accidentel de ressembler à un glisser.

Enfin, sur drop (mouseup), manipulez l'événement drop comme vous le souhaitez et effacez le drapeau de glissement possible et les coordonnées de mousedown sauvegardées. Regarder un système d'exploitation Cliquer sur un icône et le maintenir sur une icône sans bouger, puis commencer à bouger - vous verrez que ce contour est son comportement.