Utilisation d'URL pour la propriété cursor

  • Raccourci de la révision : Utilisation_d'URL_pour_la_propriété_cursor
  • Titre de la révision : Utilisation d'URL pour la propriété cursor
  • ID de la révision : 260557
  • Créé :
  • Créateur : Learning
  • Version actuelle ? Non
  • Commentaire /* Compatibility with other browsers */

Contenu de la révision

{{template.Traduction_en_cours("Using URL values for the cursor property")}}

Syntaxe

La syntaxe pour cette propriété est:

cursor: [<url>,]* motclef;

Ceci signifie que zéro ou plus d'URL peuvent être spécifié (séparé par une virgule), qui doit être suivi par un des mots clef défini dans les spécifications CSS, tels que auto ou pointer.

Par exemple, la valeur suivante sera permise:

cursor: url(foo.cur), url(http://www.example.com/bar.gif), auto;

Elle va d'abord essayer de charger foo.cur. Si ce fichier n'existe pas ou pour une autre raison n'est pas valable, bar.gif est essayé, si elle ne peut pas être utilisé non plus, auto sera utilisé.

De l'aide sur la syntaxe CSS3 pour les valeurs du curseur ont été ajouté dans Gecko 1.8beta3; ça fonctionne donc dans Firefox 1.5. et permet d'indiquer les coordonnées des points chauds du curseur qui seront maintenus aux frontières de l'image du curseur. Si aucun n'est indiqué, les coordonnées du point chaud sont lus à partir du dossier lui-même (pour les fichier CUR et XBM) ou sont réglé au coin supèrieur gauche de l'image. Un exemple de la syntaxe CSS3 est:

cursor: url(foo.png) 4 12, auto;

Le premier numéro est la coordonnée x, le second numéro est la coordonnée y. L'exemple va régler le point chaud afin d'être le pixel (4,12) par rapport au (0,0) en haut à gauche.

Limitations

Tous les formats d'images supportés par Gecko peuvent être utilisés. Ça veut dire que vous pouvez utiliser BMP, JPG, CUR, GIF, etc. Parcontre ANI n'est pas supporté. Et même si vous spécifiés un GIF animée, le curseur ne sera pas un curseur animée. Cette limitations sera peut être supprimé dans des sorties futur.

Gecko ne place pas de limitations sur la taille du curseur. Parcontre vous devriez vous limiter à une taille de 32x32 pour une compatibilité optimale avec divers plate-formes et systèmes d'exploitation. Des curseurs plus grandes que cette taille ne fonctionnerons pas sur Windows 9x (95, 98, ME).

Des curseurs translucides ne sont pas supportés sur des versions de Windows pré-XP. C'est une limitation du système d'exploitation. La transparence fonctionne sur toutes les plate-formes.

Seuls les sortis de Mozilla pour Windows, OS/2 et Linux (Quand on utilise GTK+ 2.4 ou mieux) gère les valeurs d'URL en tant que curseurs. Des supports pour d'autres plateformes seront peut-être ajoutés dans des sorties futur (Mac OS: {{template.Bug(286304)}}, QNX Neutrino: {{template.Bug(286307)}}, XLib: {{template.Bug(286309)}}, Qt: {{template.Bug(286310)}}, BeOS: {{template.Bug(298184)}}, GTK 2.0/2.2: {{template.Bug(308536)}})

Compatibilité avec d'autres navigateurs

Microsoft Internet Explorer supportés les valeurs URI pour les propriétés du curseur. Parcontre il ne supportés CUR et ANI qu'en tant que formats.

Il est également moins stricte dans la syntaxe pour les propriétes du curseur. Cela veut dire que des valeurs tels que:

cursor: url(foo.cur);

ou:

cursor: url(foo.cur), pointer, url(bar.cur), auto;

fonctionnent dans MSIE, mais ne fonctionneront pas dans des navigateurs Gecko. Pour une compatibilité avec Gecko et être en accordance avec les spécifications CSS, mettez toujours une liste d'URI d'abord, et utilisez exactement une valeur de mot clef à la fin.


à faire: Documenter ce que MSIE fait avec les emplacement CSS 3 des points chaud


Interwiki Language Links

{{ wiki.languages( { "en": "en/Using_URL_values_for_the_cursor_property", "pl": "pl/U\u017cycie_warto\u015bci_URL_dla_w\u0142asno\u015bci_cursor", "ja": "ja/Using_URL_values_for_the_cursor_property", "zh-cn": "cn/\u5229\u7528\u5149\u6807\u5c5e\u6027\u7684URL\u53c2\u6570" } ) }}

Source de la révision

<p>{{template.Traduction_en_cours("Using URL values for the cursor property")}}
</p>
<h3 name="Syntaxe"> Syntaxe </h3>
<p>La syntaxe pour cette propriété est:
</p>
<pre class="eval">cursor: [&lt;url&gt;,]* motclef;
</pre>
<p>Ceci signifie que zéro ou plus d'URL peuvent être spécifié (séparé par une virgule), qui <b>doit</b> être suivi par un des mots clef défini dans les spécifications <a href="fr/CSS">CSS</a>, tels que <code>auto</code> ou <code>pointer</code>.
</p><p>Par exemple, la valeur suivante sera permise:
</p>
<pre class="eval">cursor: url(foo.cur), url(<span class="plain">http://www.example.com/bar.gif</span>), auto;
</pre>
<p>Elle va d'abord essayer de charger foo.cur. Si ce fichier n'existe pas ou pour une autre raison n'est pas valable, bar.gif est essayé, si elle ne peut pas être utilisé non plus, <code>auto</code> sera utilisé.
</p><p>De l'aide sur la <a class="external" href="http://www.w3.org/TR/css3-ui/#cursor">syntaxe</a> CSS3 pour les valeurs du curseur ont été ajouté dans Gecko 1.8beta3; ça fonctionne donc dans Firefox 1.5. 
et permet d'indiquer les coordonnées des points chauds du curseur qui seront maintenus aux frontières de l'image du curseur. Si aucun n'est indiqué, les coordonnées du point chaud sont lus à partir du dossier lui-même (pour les fichier CUR et XBM) ou sont réglé au coin supèrieur gauche de l'image. Un exemple de la syntaxe CSS3 est:
</p>
<pre class="eval">cursor: url(foo.png) 4 12, auto;
</pre>
<p>Le premier numéro est la coordonnée x, le second numéro est la coordonnée y. L'exemple va régler le point chaud afin d'être le pixel (4,12) par rapport au (0,0) en haut à gauche.
</p>
<h3 name="Limitations"> Limitations </h3>
<p>Tous les formats d'images supportés par Gecko peuvent être utilisés. Ça veut dire que vous pouvez utiliser BMP, JPG, CUR, GIF, etc. Parcontre ANI n'est pas supporté. Et même si vous spécifiés un GIF animée, le curseur ne sera pas un curseur animée. Cette limitations sera peut être supprimé dans des sorties futur.
</p><p>Gecko ne place pas de limitations sur la taille du curseur. Parcontre vous devriez vous limiter à une taille de 32x32 pour une compatibilité optimale avec divers plate-formes et systèmes d'exploitation. Des curseurs plus grandes que cette taille ne fonctionnerons pas sur Windows 9x (95, 98, ME).
</p><p>Des curseurs translucides ne sont pas supportés sur des versions de Windows pré-XP.
C'est une limitation du système d'exploitation. La transparence fonctionne sur toutes les plate-formes.
</p><p>Seuls les sortis de Mozilla pour Windows, OS/2 et Linux (Quand on utilise GTK+ 2.4 ou mieux)  gère les valeurs d'URL en tant que curseurs. Des supports pour d'autres plateformes seront peut-être ajoutés dans des sorties futur (Mac OS: {{template.Bug(286304)}}, QNX Neutrino: {{template.Bug(286307)}}, XLib: {{template.Bug(286309)}}, Qt: {{template.Bug(286310)}}, BeOS: {{template.Bug(298184)}}, GTK 2.0/2.2: {{template.Bug(308536)}})
</p>
<h3 name="Compatibilit.C3.A9_avec_d.27autres_navigateurs"> Compatibilité avec d'autres navigateurs </h3>
<p>Microsoft Internet Explorer supportés les valeurs URI pour les propriétés du <code>curseur</code>. Parcontre il ne supportés CUR et ANI qu'en tant que formats.
</p><p>Il est également moins stricte dans la syntaxe pour les propriétes du <code>curseur</code>. Cela veut dire que des valeurs tels que:
</p>
<pre class="eval">cursor: url(foo.cur);
</pre>
<p>ou:
</p>
<pre class="eval">cursor: url(foo.cur), pointer, url(bar.cur), auto;
</pre>
<p>fonctionnent dans MSIE, mais ne fonctionneront pas dans des navigateurs Gecko. Pour une compatibilité avec Gecko et être en accordance avec les spécifications CSS, mettez toujours une liste d'URI d'abord, et utilisez exactement une valeur de mot clef à la fin. 
</p><p><br>
</p>
<dl><dd> <i>à faire: Documenter ce que MSIE fait avec les emplacement CSS 3 des points chaud  </i>
</dd></dl>
<p><br>
<span class="comment">Interwiki Language Links</span>
</p>{{ wiki.languages( { "en": "en/Using_URL_values_for_the_cursor_property", "pl": "pl/U\u017cycie_warto\u015bci_URL_dla_w\u0142asno\u015bci_cursor", "ja": "ja/Using_URL_values_for_the_cursor_property", "zh-cn": "cn/\u5229\u7528\u5149\u6807\u5c5e\u6027\u7684URL\u53c2\u6570" } ) }}
Revenir à cette révision