Contents ...
udn網路城邦
精選
【教學】游標穿新衣
2008/05/04 01:11
瀏覽10,664
迴響14
推薦25
引用2


你是不是也想讓游標穿新衣呢?

跟著做，就ok哩!

滑鼠游標樣式語法： 引用自：

<STYLE type="text/css">
<!--
body{選擇想要的游標樣式語法;} 
-->
</STYLE>

例如：

<STYLE type="text/css">
<!--
body{cursor:move;} 
-->
</STYLE>

此為十字箭頭的游標

  • 作業中 cursor:progress
  • 十字型 cursor:crosshair
  • 箭頭朝上 cursor:n-resize
  • 箭頭朝下 cursor:s-resize
  • 十字箭頭 cursor:move
  • 箭頭朝右 cursor:e-resize
  • 箭頭朝左 cursor:w-resize
  • 加一問號 cursor:help
  • 箭頭朝左上 cursor:nw-resize
  • 箭頭斜右下 cursor:se-resize
  • 文字I型 cursor:text
  • 箭頭斜左下 cursor:sw-resize
  • 箭頭朝右上 cursor:ne-resize
  • 漏斗 cursor:wait
  • 手型(IE6) cursor:pointer
  • 無法使用(IE6) cursor:not-allowed  

    游標圖案語法：

    <STYLE type="text/css">
    <!--
    body{cursor:url(游標網址);}/*移到網頁時的滑鼠游標*/
    a{cursor:url(游標網址);}/*移到超連結時的滑鼠游標*/ 
    -->
    </STYLE>

    PS．游標副檔名須為.ani / .cur / .ico

    游標素材：感謝栀baby做的整理

     

  • →游標的對應網址:
    游標編號1-5
    游標編號6-10
    游標編號11-15
    游標編號16-20
    游標編號21-25
    游標編號26-30
    游標編號31-35
    →其他游標素材網站：
    語法放置位置：
    進階教學：
    附註１：引用自：

    滑鼠游標樣式可運用在任何標籤.例如:
    整個網頁body{cursor:e-resize}
    所有表格內table{cursor:e-resize}
    使用圖案滑鼠游標例如:
    body {cursor:url("mything.cur"),url("mything.cur"),text;}
    當無法處理游標名單的第一個游標,則會以第二個游標代替
    若無法處理任何定義的游標,最後便以一般游標text顯示
    (圖案滑鼠游標寫法是W3C發佈的標準)
    |X| 大部份常寫為 cursor:url(img/cur_f4.ani) 這是錯誤的
    附註２：請使用游標素材者下載游標後上傳自個人網路空間，請勿直接連結。
    為了原提供素材者的流量著想，也為自己著想吧！

    延伸閱讀:ｃｓｓ教學 -- 變更ฺ滑鼠指標
    • 有誰推薦more
    迴響（14） ：
    14樓. 雪莉酒
    2010/04/06 00:09
    麻煩學姊

    我把照片po在我部落格的相本裡

    可以請學姐去看看嗎?

    上面就會很清楚

    學妹你有在按確定之前~點選在"編輯自定模式"嗎?

    如下圖的第5點處!

    ─=☆EG☆=─ 於 2010/04/12 23:37回覆
    13樓. 雪莉酒
    2010/03/22 20:58
    貼上照片

    這是未貼上游標前

    這是貼上游標後，游標是有了，但，背景不見ㄌ，而且連標題也沒了

    學妹我看不到你貼的圖片

    ─=☆EG☆=─ 於 2010/03/23 10:31回覆
    12樓. 雪莉酒
    2010/03/21 16:31
    游標可以用但.....

    首先先感謝學姐提供游標^^

    可是我PO上去時

    游標可以用，但背景圖卻不見了

    已經試了好幾次都這樣

    可以告訴我是什麼原因嗎?

    阿勒

    不會是去動到背景圖的語法了吧!?

    ─=☆EG☆=─ 於 2010/03/22 19:21回覆

    你可以拍下畫面給我看嗎?我比較方便瞭解!

    或是把全部語法貼給我看!

    ─=☆EG☆=─ 於 2010/03/22 19:23回覆
    11樓. Meil
    2009/11/21 00:23
    3Q
    謝謝大大分享=D
    ─=☆EG☆=─ 於 2010/02/05 15:56回覆
    10樓. ~*御楓*~
    2009/08/25 23:05
    分享

    分享囉!

    謝囉

    ─=☆EG☆=─ 於 2009/08/29 12:59回覆
    9樓. 德
    2009/02/01 17:44
    = =

    看了你的說明

    還是不太懂

    游標要線上傳到相簿嗎?

    還是...

    不是唷!

    是網路空間!

    例如~如果你有申請gmail那他會有個網頁空間給你!

    ─=☆EG☆=─ 於 2009/02/03 21:22回覆
    8樓. susan
    2008/11/22 12:37
    感謝分享
    我拿走一些嚕!!
    感謝分享喔!!

    ok的!哈

    ─=☆EG☆=─ 於 2008/11/22 19:06回覆
    7樓. 黃色呆鴨
    2008/11/21 14:59
    游標穿新衣

    好多流星的背景~不知道可否許願~

    感謝EC游標穿新衣的教學~

    可以許願呀^^

    你也可以點播歌曲唷^^cc

    不客氣，這都是搜集來的!

    如果有不懂再問我吧^^

    我會盡力去幫你解答的^^

    ─=☆EG☆=─ 於 2008/11/22 00:04回覆
    6樓. V家
    2008/10/31 19:36
    字好小啊

    文章的字好小哦~~
    我要去拿放大鏡才能看到您的教學指導
    謝謝這個教學貼
    有空也要學著弄一個玩一玩

    哈~因為EG調皮~把字縮小了!ㄎㄎ

    好好玩唷!

    ─=☆EG☆=─ 於 2008/11/01 10:23回覆
    5樓. ─=☆EG☆=─
    2008/10/25 17:28
    預覽游標圖案

    ◎  預覽游標圖案+顯示游標網址  ◎

    <font style="cursor: url('游標網址')">☆把滑鼠移來此處就會顯示游標☆：游標網址>

     

     

    ◎  預覽游標圖案 +下載  ◎

    <font style="CURSOR: url('游標網址')">☆把滑鼠移來此處就會顯示游標☆</font></font> </font><a href="游標網址" target="_blank">按此下載</a>

    FROM: 安妮的窩

    最前頁 1 2 最末頁
    到 / 2 頁
    發表迴響

    會員登入