* [CODE(CSS)@en[cursor]] 特性 (CSS) [6] 仕様書: - [[CSS 2]] -- [CITE@en[18.1 Cursors: the [CODE(CSS)@en['cursor']] property]] - [[CSS 3]] -- [CITE@en[CSS3 Basic User Interface Module]] [5] [CODE(CSS)@en[cursor]] 属性の[[鍵語]]による指定: ,値 ,説明 ,状態 ,出典 ,[CODE(CSS)@en[[[alias]]]] , ,[[W3C]] [[勧告候補]] ,[[CSS 3]] ,[CODE(CSS)@en[[[all-scroll]]]] , ,[[W3C]] [[勧告候補]] ,"[WinIE 6], [[CSS 3]]" ,[CODE(CSS)@en[[[auto]]]] ,[[自動]] ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[cell]]]] , ,[[W3C]] [[勧告候補]] ,[[CSS 3]] ,[CODE(CSS)@en[[[col-resize]]]] , ,[[W3C]] [[勧告候補]] ,"[WinIE 6], [[CSS 3]]" ,[CODE(CSS)@en[[[context-menu]]]] , ,[[W3C]] [[勧告候補]] ,[[CSS 3]] ,[CODE(CSS)@en[[[copy]]]] , ,[[W3C]] [[勧告候補]] ,[[CSS 3]] ,[CODE(CSS)@en[[[crosshair]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[default]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[e-resize]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[ew-resize]]]] , ,[[W3C]] [[勧告候補]] ,[[CSS 3]] ,[CODE(CSS)@en[[[-moz-grab]]]] , , ,[Gecko] ,[CODE(CSS)@en[[[-moz-grabbing]]]] , , ,[Gecko] ,[CODE(CSS)@en[[[hand]]]] ,手 ,非標準 → [CODE(CSS)@en[[[pointer]]]] ,[WinIE] ,[CODE(CSS)@en[[[help]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[inherit]]]] ,[[継承]] ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[move]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[n-resize]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[ne-resize]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[nesw-resize]]]] , ,[[W3C]] [[勧告候補]] ,[[CSS 3]] ,[CODE(CSS)@en[[[no-drop]]]] , ,[[W3C]] [[勧告候補]] ,"[WinIE 6], [[CSS 3]]" ,[CODE(CSS)@en[[[none]]]] , ,[[W3C]] [[勧告候補]] ,[[CSS 3]] ,[CODE(CSS)@en[[[not-allowed]]]] , ,[[W3C]] [[勧告候補]] ,"[WinIE 6], [[CSS 3]]" ,[CODE(CSS)@en[[[ns-resize]]]] , ,[[W3C]] [[勧告候補]] ,[[CSS 3]] ,[CODE(CSS)@en[[[nw-resize]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[nwse-resize]]]] , ,[[W3C]] [[勧告候補]] ,[[CSS 3]] ,[CODE(CSS)@en[[[pointer]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[progress]]]] , ,[[W3C]] [[勧告候補]] ,"[WinIE 6], [[CSS 2.1]]" ,[CODE(CSS)@en[[[row-resize]]]] , ,[[W3C]] [[勧告候補]] ,"[WinIE 6], [[CSS 3]]" ,[CODE(CSS)@en[[[s-resize]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[se-resize]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[sw-resize]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[text]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[vertical-text]]]] , ,[[W3C]] [[勧告候補]] ,"[WinIE 6], [[CSS 3]]" ,[CODE(CSS)@en[[[w-resize]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[wait]]]] , ,[[W3C]] [[勧告]] ,[[CSS 2]] ,[CODE(CSS)@en[[[-moz-zoom-in]]]] , , ,[Gecko] ,[CODE(CSS)@en[[[-moz-zoom-out]]]] , , ,[Gecko] [8] [CODE(CSS)@en[[[-moz-alias]]]] ([[名無しさん]] [sage]) [[#comment]] ** 歴史 [7] この[[特性]]は [[CSS 2]] で標準化されました。 @@ [[WinIE]] の実装とどちらが先? [[#comment]] ** メモ [1] 厨房的[[不思議マーク付け]]サイト (中高生サイトや同人系サイトが多いと思われ。) で、 [[HTML]] の [[style]] 要素を使って [CODE(CSS)[cursor: crosshair]] とかにしてるところって多いですよねぇ。どうしてあれがいいんだかようわからん... [4] 誤 [CODE(CSS)[cursor: [[hand]]]] 正 [CODE(CSS)[cursor: [[pointer]]]] [9] [CITE[Using URL values for the cursor property - MDC]] ([[名無しさん]]) [10] [CITE[MFSA 2007-04: Spoofing using custom cursor and CSS3 hotspot]] ([CODE[2007-02-24 04:08:29 +09:00]] 版) ([[名無しさん]] [WEAK[2007-02-24 03:20:57 +00:00]]) [11] [CITE@en[Enhance Opera's mouse cursor over text - Lee Harvey's Target Range - by Lee Harvey]] ([CODE[2007-03-04 13:30:41 +09:00]] 版) ([[名無しさん]] [WEAK[2007-03-04 04:34:16 +00:00]]) [12] [CITE[d:id:quaa]] ([CODE[2007-03-05 03:42:27 +09:00]] 版) ([[名無しさん]] [WEAK[2007-03-04 22:39:08 +00:00]]) [13] [CITE@ja-jp[マイクロソフト セキュリティ アドバイザリ (935423): Windows アニメーション カーソル処理の脆弱性]] ([CODE[2007-04-01 11:15:54 +09:00]] 版) ([[名無しさん]] [WEAK[2007-04-01 02:16:12 +00:00]]) [14] [CITE@ja[「Windowsアニメーションカーソルの脆弱性」@水無月ばけらのえび日記]] ([CODE[2007-04-01 02:56:20 +09:00]] 版) ([[名無しさん]] [WEAK[2007-04-01 02:17:47 +00:00]]) [15] [CITE[葉っぱ日記 - 「Windowsアニメーションカーソルの脆弱性」@水無月ばけらのえび日記]] ([CODE[2007-03-30 17:40:40 +09:00]] 版) ([[名無しさん]] [WEAK[2007-04-01 02:18:07 +00:00]]) [16] [CITE[Bug 302536 – crash '''['''@ nsEventStateManager::UpdateCursor ''']''' when visiting and/or printing a page on www.vdab.be]] ([CODE[2007-05-11 20:33:53 +09:00]] 版) ([[名無しさん]] [WEAK[2007-05-11 11:39:33 +00:00]]) [17] [CITE[Styling of area elements (as displayed within referencing image)]] ([[L. David Baron ]] 著, [CODE[2007-05-10 18:21:21 +09:00]] 版) ([[名無しさん]] [WEAK[2007-05-11 11:42:39 +00:00]]) [18] 手元の [[WinIE 6]] では で[['''クラッシュ''']]します。 もっと単純化してもたまに発生しますが、正確な再現条件は不明です。上記の例では手元の環境で確実に発生します。 [[読点]]区切りの値のうちの1つに[[空文字列]]とみなせるものが含まれていると発生するようです。 ([[名無しさん]]) [19] [CODE(CSS)@en[[[cursor]]: [[url]](image)]] [[CSS 2.1]] 違反。 ([[名無しさん]]) [20] [CODE(CSS)@en[[[cursor]]: [[url]](image), [[crosshair]]]] ([[名無しさん]]) [21] [CODE(CSS)@en[[[cursor]]: [[url]](image), [[url]](image-404), [[crosshair]]]] ([[名無しさん]]) [22] >>19-21 [[Opera]] 9 は [CODE(CSS)@en[[[url]]()]] にまったく対応していないようで、 [[宣言]]ごと[[無視]]します。[[Firefox]] 2 と [[WinIE 6]] では全部 [[CSSOM]] 中に現れます。 ([[名無しさん]]) [23] [[WinIE 6]] の [[CSS]] → [[CSSOM]] ([[カオス]]) = [CODE(CSS)@en[[[url]](]] が含まれていれば ([[escape]] されていてもおk): == 全体の最初が [CODE(CSS)@en[[[url]](]] で最後が [CODE(CSS)[[[)]]]] なら、 [[CSSOM]] に現れる値はそれらを除去したものになる。 例えば では [CODE(CSS)[a), b, c]] が [[CSSOM]] に現れる。 == [[読点]]で区切られている値の[[並び]]とみなす。 == [CODE(CSS)@en[[[IDENT]]]] や [CODE(CSS)@en[[[STRING]]]] や [CODE(CSS)@en[[[URI]]]] は通常通り処理される。 == [[空白]]はどこにでも挿入できる。[[特性値]]全体の最初や最後のものは捨てられる。 [[読点]]の前後のものは [[CSSOM]] 上は捨てられない。[[URI]] と見なす際に除去される模様 (要検証)。それ以外の途中の[[空白]]は [[URI]] と見なす際にも除去されない模様 (要検証)。 == [[注釈]]はどこにでも挿入できる。捨てられる。 == [[空白]]や[[注釈]]を無視して[[空文字列]]になると >>19 のクラッシュが発生し得る。 == [[空白]]や[[注釈]]を無視した結果が [CODE(CSS)@en[[[url]](]] で始まり [CODE(CSS)[[[)]]] なら、[[URI]] としての解釈上は無視する ([[CSSOM]] 上はそのまま残る)。]] それらが含まれていても、その前や後ろに違うものがあれば、無視しない (例えば [CODE(CSS)@en[a url(b) c]] はこれ全体が [[URI]] とみなされる)。 == [CODE(CSS)[[[;]]]] や [CODE(CSS)[[[!]]]] を除き、おおよそどんな [CODE(CSS)@en[[[DELIM]]]] もそのまま残る。 [CODE(CSS)[[[{]]]] もおkだが、[[宣言]]の[[構文解析]]の段階で [CODE(CSS)[[[}]]]] との対応がチェックされる ([[URI]] として解釈するために[[読点]]で分割する段階では対応関係は考慮されない)。 = [CODE(CSS)@en[[[url]](]] が含まれていなければ、 値が1つ指定されたものとみなす。理解できる値でなければ、 [[宣言]]ごと[[無視]]する。[[escape]] の処理などは通常通り行われる。 ([[名無しさん]]) [24] >>23 [[CSSOM]] に現れる値は、>>19 のように [CODE(CSS)@en[[[url]]()]] 1つだけの場合には [CODE(CSS)@en[[[url]]('image')]] 的に[[関数名]]の[[escape]]と[[大文字]]・[[小文字]]と括弧内の[[空白]]や[[escape]]が[[正規化]]され、[CODE(CSS)[[[']]]] で括られたものになります。 >>20 も含めてそれ以外の場合の [CODE(CSS)@en[[[url]]()]] は、[[関数名]]の [[escape]] とと括弧内の [[escape]] だけを[[正規化]]します。 ([[名無しさん]]) [25] [CODE(CSS)@en[[[cursor]]: a, [[url]]([[crosshair]])]] のように [CODE(CSS)@en[[[URI]]]] としていても、 [CODE(CSS)@en[[[IDENT]]]] の場合のように扱われてしまいます ([[十字]]の[[指示子]]になります)。 ([[名無しさん]]) [26] [CODE(CSS)@en[[[cursor]]: cross/**/hair]] このように途中に[[注釈]]が入っていても [[WinIE 6]] では[[十字]]の[[指示子]]になります。 ([[名無しさん]]) [27] [CODE(CSS)@en[[[cursor]]: cross/**/hair]] このように途中に[[注釈]]が入っていても [[WinIE 6]] では[[十字]]の[[指示子]]になります。 ([[名無しさん]]) [28] 間に何もない[[読点]]の連続 [[Firefox]] 2 は[[宣言]]ごと[[無視]]します。 ([[名無しさん]]) [29] [[Firefox]] 2 では[[読点]]は [CODE(CSS)[[[,]]]] のあとに [CODE(charname)@en[[[SPACE]]]] 1つに[[正規化]]されます。 ([[名無しさん]]) [30] [[WinIE 6]] の [CODE(DOMa)@en[[[currentStyle]]]] で得られるのは実際に使っている値だけのようです。 ([[名無しさん]]) [31] 候補がいくつかあるときにどれが使われるのかはよくわかりません。 は [CODE(CSS)@en[[[e-resize]]]] は [CODE(CSS)@en[[[crosshair]]]] ([CODE(DOMa)@en[[[currentStyle]]]] も) は [CODE(CSS)@en[[[n-resize]]]] ;; 真ん中!? ([[名無しさん]]) [32] [[Opera]] 9 は元々値を1つしか指定できないので [CODE(DOMa)@en[[[currentStyle]]]] も面白い結果にはなっていませんね。。。 ([[名無しさん]]) [33] [CODE(CSS)@en[[[cursor]]: [[hand]]]] ([[名無しさん]]) [34] >>33 [[WinIE 7]] では [CODE(CSS)@en[[[hand]]]] のまま [[CSSOM]] に現れます (ちなみに [CODE(CSS)@en[[[pointer]]]] もそのまま)。 [[Opera]] 9.27 では [CODE(CSS)@en[[[pointer]]]] として [[CSSOM]] に現れます。 [[Firefox]] 2 と [[Safari]] 3 は未対応。 ([[名無しさん]]) [35] [CITE[Bug 346690 – Implement CSS3 CR cursor:none]] ([CODE[2008-09-16 07:54:09 +09:00]] 版) ([[名無しさん]]) [36] [CITE[cursor:auto - how it defined - mozilla.dev.tech.css | Google グループ]] ([TIME[2008-10-11 12:12:45 +09:00]] 版) ([[名無しさん]]) [[#comment]] * INPUT 要素, TEXTAREA 要素の CURSOR 属性 (HTML) [2] [[WebTV]] では、 [[type]] 属性が [CODE(HTML)[text]] 又は [CODE(HTML)[password]], [CODE(HTML)[textarea]] である [[input]] 要素, [[textarea]] 要素で [CODE(HTML)[CURSOR]] 属性が使えます。 [3] [[カーソル]] (文字入力用のもののことか。) の色を指定します。 既定値は [CODE(HTML)[#3333AA]] ですが、暗い背景色 ([[bgcolor]] 属性値) の場合は [CODE(HTML)[yellow]] になるんだそうです。 [[#comment]] * メモ