cursor: none marche pas toujours ?
Le
Une Bévue
sur un canvas, j'ai mis :
#picker {
/*
cursor: crosshair;
*/
cursor: none;
float: left;
margin: 10px;
border: 0;
}
quelque fois, je n'ai pas de curseur (rarement), la plus part du temps
j'ai le curseur par défaut ?
comment remédier à ça ?
#picker {
/*
cursor: crosshair;
*/
cursor: none;
float: left;
margin: 10px;
border: 0;
}
quelque fois, je n'ai pas de curseur (rarement), la plus part du temps
j'ai le curseur par défaut ?
comment remédier à ça ?
cursor: none; fonctionne sur les versions actuelles de Firefox, Chrome,
Edge et IE. Lien pour tester:
http://www.w3schools.com/cssref/playit.asp?filename=playcss_cursor&preval=none
Attention, d'après moi, cursor:none, c'est simplement un curseur tout
transparent. Ça continue à "se comporter".
Et de plus il y a un risque qu'un curseur qui disparait soit ressenti
comme très inconfortable. Une pratique normale serait plutôt le curseur
standard dé-bindé de tout comportement. En revanche un curseur
au-dessus d'une image peut disparaitre au bout de x" (x petit)
d'immobilité, pour répapparaitre immédiatement quand la souris gigote.
Un curseur en url(xxxx.cur) fonctionne sur tout navigateur décent,
facile d'en faire un tout transparent. Attention, un .png ne fonctionne
pas toujours.
--
Pierre Maurette
Je suis d'accord. Le but de la manip est de remplacer la comportement du
curseur "normal" par un autre (une image positionnée par onmousemove).
En fait, le curseur se balade sur un canvas où est dessiné une color
wheel. Et au lieu de laisser faire le "onmousemove" tout seul, je ne
rafraichi la position de mon curseur que 50 fois par seconde. la
position de la souris seule étant enregistrée par ailleurs, et en
continu par onmousemove :
var cursorX, cursorY, cursorR, canvasRect;
document.onmousemove = function(e){
cursorX = e.pageX;
cursorY = e.pageY;
var dX = ((canvasRect.left + canvasRect.right) / 2 - cursorX);
var dY = ((canvasRect.top + canvasRect.bottom) / 2 - cursorY)
cursorR = Math.round(Math.sqrt(dX * dX + dY * dY) * 100) / 100;
}
par ce procédé le positionnement du curseur à un endroit donné de la
roue colorée est nettement plus facile et précise. Sinon ça tremblotte
et ça saute.
Ouais, j'ai vu ça un "url(xxxx.cur)" mais je ne sais pas comment en
faire un sur Mac OS X.