Curseurs CSS pour le glisser-déposer : extension de la compatibilité
Lors de la conception d'applications Web impliquant une fonctionnalité de glisser-déposer, il est crucial de fournir une expérience utilisateur cohérente et intuitive sur différents navigateurs. Si les curseurs -moz-grab et -moz-grabbing de Mozilla sont idéaux pour indiquer le début du glisser et l'opération glisser dans Firefox, la question demeure : existe-t-il des curseurs équivalents pour d'autres navigateurs ?
Pour garantir le cross-browser compatibilité, pensez à utiliser le code CSS suivant :
<code class="css">.grabbable { cursor: move; /* fallback if grab cursor is unsupported */ cursor: grab; cursor: -moz-grab; cursor: -webkit-grab; } /* (Optional) Apply a "closed-hand" cursor during drag operation. */ .grabbable:active { cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing; }</code>
Dans ce code, les navigateurs appliquent le curseur le plus largement supporté (« move ») comme solution de secours lorsque le les curseurs de saisie ne sont pas pris en charge. Les curseurs -moz-grab et -webkit-grab sont inclus respectivement pour la compatibilité avec les navigateurs basés sur Mozilla et WebKit (tels que Chrome et Safari).
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!