2008/11/12

cursor

cursor

指定滑鼠游標的型態。其語法是:

cursor:游標型態

cursor:<uri> [x y] ,游標型態

可設多個 <uri>,兩個 <uri> 用”,”分隔。如果第一個 <uri> 找不到,會用第二個 <uri>,依此類推。每一個 <uri> 可選擇性設 x, y 作為指標位置,兩個必須同時設,缺一會導致失敗。x, y 為數值,是以游標圖形的左上角為 (0, 0) 原點之座標值。最後設定一個游標型態,當 <uri> 都失敗時,可用此游標。使用 <uri> 最後一定要接一個游標型態,否則會失敗。在 IE 瀏覽器,兩個 <uri> 之間還可以插入游標型態,這在 Firefox 會導致失敗,建議勿用。

可設定的值有:

  1. URI:指定游標圖檔的網址。
  2. 游標型態:auto, default, none。context-menu, help, pointer, progress, wait。cell, crosshair, text, vertical-text。alias, copy, move, no-drop, not-allowed。e-resize, n-resize, ne-resize, nw-resize, s-resize, se-resize, sw-resize, w-resize, ew-resize, ns-resize, nesw-resize, nwse-resize, col-resize, row-resize, all-scroll。參見下面的範例。
  3. inherit:繼承父元件的特徵值。

不同瀏覽器展現的游標圖案會有差異。

  • <uri> 在 IE6 測試失敗,IE 只支援 ICO, CUR, ANI 圖檔格式;Firefox, Safari, Chrome 都可用 GIF 檔。筆者在個人電腦測試 ICO 檔,所有的瀏覽器都可以用;因為部落格不能上傳 ICO 檔,所以無法在此展示。

一般游標:

  • none 只有 Firefox 成功;IE6, Safari, Chrome 都沒效果。

移動與拷貝:

  • alias, copy 在 IE6, Safari 沒效果;Firefox, Chrome 可用。

改變物件的尺寸。e 是東方(east),s 是南方(south), w 是西方(west),n 是北方(north);可以組合上面四個字母。

選擇游標:

  • cell 在 IE6, Safari 沒效果;Firefox, Chrome 可用。

連結與狀態

:ACTIVE 的應用。使用時要注意,在 IE6 中 :ACTIVE 只能用在 ANCHOR 元素。

  • 上例,Firefox 成功;Safari, Chrome 失敗。

javascript 應用。可以用 style 物件 的特徵 cursor 讀取或設定特徵值。