Gecko 1.8 (Firefox 1.5, SeaMonkey 1.0) では、CSS2 cursor プロパティー で URL 値が使用できます。これにより、自由な画像 — Gecko がサポートする画像形式なら — がマウスカーソルとして利用できます。
構文
このプロパティーの記述方式は以下のようになります。
cursor: [<url>,]* keyword;
これは、カンマ区切りのゼロ個以上の URL が指定可能で、その後ろに CSS 規格で定義されている auto や pointer といったキーワードを一つ指定する必要があります。
たとえば、以下のような指定は可能です :
cursor: url(foo.cur), url(https://www.example.com/bar.gif), auto;
この場合、最初に foo.cur を読み込もうとします。もし、存在しないかその他の理由により利用できない場合、bar.gif を試しますが、両方利用できない場合は auto が利用されます。
cursor 値での CSS3 書式 のサポートが Gecko 1.8beta3 で付け加えられました。(そのため、Firefox 1.5 でも動作します) このことにより、カーソルのホットスポットの座標を指定できるようになります。もし、指定されていなければ、ホットスポットの座標はファイルそのもの (CUR もしくは XBM ファイル) か、画像の左上端に設定されます。CSS3 における書式のサンプルは
cursor: url(foo.png) 4 12, auto;
となります。
最初の値が x 座標、二つ目の値が y 座標になります。サンプルではホットスポットが、左上端 (0,0) に対して (4,12) のピクセルに設定されます。
制限事項
Gecko でサポートされているすべての画像形式が利用可能です。これは、BMP、JPG、CUR、GIF などが利用できることを意味します。しかしながら、ANI はサポートされていません。また、アニメーション GIF を指定した場合でも、カーソルはアニメーションを行いません。この制限は、将来のリリースで除かれる可能性があります。
Gecko それ自体には、カーソルサイズの制限はありません。しかしながら、OS やプラットフォームの互換性のために、最大サイズを 32x32 にするのがよいでしょう。特に、このサイズより大きなカーソルは、Windows 9x (95, 98, Me) では動作しません。
半透明カーソルは、Windows XP より前ではサポートされていません。これは、OS の制限です。透明度はすべてのプラットフォームで動作します。
Windows、OS/2 と Linux (GTK+ 2.4 以上の場合) での Mozilla リリースでのみ、カーソルにURL 値が利用できます。その他のプラットフォームでのサポートは、将来のリリースで加えられる予定です。(Mac OS: バグ 286304, QNX Neutrino: バグ 286307, XLib: バグ 286309, Qt: バグ 286310, BeOS: バグ 298184, GTK 2.0/2.2: バグ 308536)
ほかのブラウザとの互換性
Microsoft Internet Explorer でも cursor プロパティーに URL 値を利用できます。しかしながら、CUR と ANI フォーマットのみをサポートしています。
また、cursor プロパティーの書式の制限もゆるいです。これは、
cursor: url(foo.cur);
または:
cursor: url(foo.cur), pointer, url(bar.cur), auto;
なども、MSIE では動作することを意味しますが、Geckoブラウザでは動作しません。Gecko との互換性と CSS 規格との整合性からも、URI リストを最初に、最後にキーワード値を一つ入れるべきです。
- To-do: MSIE が CSS3 ホットスポット座標について行うことについて記述