July 26, 2004

[教學]製作CSS滑鼠游標

用途:無名相簿採用的語法是CSS.而CSS的滑鼠游標是用ani.ico.cur等cursor檔案
並不能像java語法一樣用jpg或gif這樣滑鼠帶圖語法

軟體:Microangelo
載點1


開啟說明:安裝完之後.到開始-->程式集-->Microangelo-->選Animator
這樣就會開啟編輯畫面

圖上的按鈕功能說明:
圖上標的1-6都是編輯繪圖的功能鍵.就像小畫家一樣
1=>畫筆
2=>直線
3=>填色
4=>橡皮擦
5=>矩形方框
6=>文字

7=>編輯繪圖區
8=>你製作出的每個"影格"
9=>複製影格
10=>刪除影格
11=>設定滑鼠感應點
12=>使畫錯的圖回復原本"透明"

製作步驟:
(1)在編輯繪圖區上面用色筆畫出你想要的圖
可利用矩形.直線.橡皮擦等工具
如果畫錯了可用圖標12使恢復原本透明狀態
利用"預覽"畫面進行更改
(2)做好第一個圖之後.用圖標9來複製畫格.這樣就會變成動態游標的效果
當然你要每個圖都要稍作不同的更改.才會造成變化
隨意看你要設定幾個圖都可以
(3)每個畫格都製作完成之後.按圖標11那個按鈕
然後指到你箭頭的頂點(如圖箭頭所示).即滑鼠感應點
(4)然後去檔案裡面存檔.將會製成ani檔案

加入無名相簿的css樣式表語法如下:
body{cursor:url("cur檔圖片網址1")}
a:hover {cursor:url("cur檔圖片網址2")}


body放的是你在畫面上呈現的游標圖
a:hover放的是按超連結的變成的游標圖

使用限制:
1.很多免費空間(pchome)不會支援ani檔案
請自行找可以放cur檔的空間
2.據說是IE6.0以上版本才看的到.可是我覺得大家應該都看的到啦!!!

<另外的製作方法>直接把jpg或bmp的檔案轉成ico檔
也是利用這個軟體.不過在開啟Microangelo時是選最後一個Studio
找到你想要放上去的游標圖之後-->如果是GIF檔案可以直接作修改.如果是BMP或JPG檔.請先用瀏覽圖的程式開啟然後另存為GIF檔案(不可以直接改副檔名.用小畫家.ACDC.PI這些看圖程式都可以另存新檔)-->定Angelo裡面的Studio之後.開啟你要的這張GIF圖(檔案類型選GIF format)-->按"檔案"裡面的另存新檔(存檔類型選ICON那一個).就會存成ico檔案-->連結語法同上


 

唉!!原本網誌想說些心情給妳聽的.可是我也不知道你聽不聽的到....做人還是實際一點好.來寫教學服務大眾吧!!!

70推薦此文章
Today's Visitors: 2 Total Visitors: 59581
Personal Category: 無名教學(進階篇) Topic: 未分類
[Trackback URL]
1 2 Next
  • 本篇文章引用自此 ...

  • 000 【a871003的網路日誌】 at November 16, 2005 10:51 AM Trackback | prosecute
  • 本篇文章引用自此 這個教學實在是太詳細了啦~ 輾轉之間 被介紹去看他的教學 等改天期

  • 如何製作CSS滑鼠游標 【傳說 期末是隻大怪獸】 at January 10, 2006 01:14 AM Trackback | prosecute
  • [教學]製作CSS滑鼠游標 用途:無名相簿採用的語法是CSS.而CSS的滑鼠游標是用ani.ico.cur等cursor檔案 並不能像java語法一樣用j

  • [教學]製作CSS滑鼠游標 【Just〃Coco 白ㄘ〞日誌】 at January 31, 2006 06:32 PM Trackback | prosecute
  • 本篇文章引用自此

  • 111 【rose520922的網路日誌】 at March 18, 2006 05:48 PM Trackback | prosecute
  • 本篇文章引用自此 剛剛在凱哥裡看到 有空也想試試看

  • 自製游標?! 【vava \'s Blog】 at August 9, 2006 01:39 AM Trackback | prosecute
  • 本篇文章引用自此

  • 2 【好好ㄉ珍惜對方】 at August 21, 2006 11:15 AM Trackback | prosecute
  • 愛亂畫的蕾蕾也自己畫了幾款滑鼠游標! 目前還慢慢畫緩慢更新中,沒靈感,大家有什麼好主意可以通報一下嗎?喜歡什麼特殊樣式也可以告訴我,我

  • [分享]蕾蕾的手繪游標 【大家都愛小嬡岑~】 at August 24, 2006 06:24 PM Trackback | prosecute
  • 本篇文章引用自此

  • 21 【ck0808 \'s Blog】 at September 26, 2006 12:33 PM Trackback | prosecute
  • 本篇文章引用自此

  • 0.0 【萱ㄟ點滴...】 at January 17, 2007 11:38 PM Trackback | prosecute
  • 用途:無名相簿採用的語法是CSS.而CSS的滑鼠游標是用ani.ico.cur等cursor檔案 並不能像java語法一樣用jpg或gif這樣滑鼠帶圖

  • [教學]製作CSS滑鼠游標 【月影 ﹢ 天空無限】 at May 13, 2007 04:36 PM Trackback | prosecute
  • [教學]製作CSS滑鼠游標 用途:無名相簿採用的語法是CSS.而CSS的滑鼠游標是用ani.ico.cur等cursor檔案 並不能像java語法一樣用jpg或gif這樣滑鼠帶圖語法 軟

  • 自製滑鼠游標 【PM530 \'s Blog☆】 at May 17, 2007 06:18 PM Trackback | prosecute
  • 本篇文章引用自此

  • 自 製 【f71141318 \'s Blog】 at August 22, 2007 09:12 AM Trackback | prosecute
  • 本篇文章引用自此 目前沒時間整理~ 所以請大家先點上方進入教學吧!

  • 【教學】製作CSS滑鼠游標 【★紫色的依戀~ ♀薰衣草♪等待幸福♂】 at August 31, 2007 11:46 AM Trackback | prosecute
  • 本篇文章引用自此

  • 游標教學 【玉米搭  專屬日記】 at February 27, 2008 11:56 PM Trackback | prosecute
  • 用途: 無名相簿採用的語法是CSS.而CSS的滑鼠游標是用ani.ico.cur等cursor檔案 並不能像java語法一樣用jpg或gif這樣滑鼠帶圖語法

  • [教學]製作CSS滑鼠游標 【在異想的天空下飛翔 飛往不知名的前方 不管會到哪裡 】 at July 11, 2008 11:10 PM Trackback | prosecute
  • 用途:無名相簿採用的語法是CSS.而CSS的滑鼠游標是用ani.ico.cur等cursor檔案 並不能像java語法一樣用jpg或gif這樣滑鼠帶圖語法 軟體:Microangelo 開

  • 製作CSS滑鼠遊標 【★〃豬暄之窩】 at July 25, 2008 01:22 PM Trackback | prosecute
  • [教學]製作CSS滑鼠游標 用途: 無名相簿採用的語法是CSS.而CSS的滑鼠游標是用ani.ico.cur等cursor檔案 並不能像java

  • [教學]製作CSS滑鼠游標 【http://www.wretch.cc/blog/loveshe81519/22322250】 at August 16, 2008 05:05 AM Trackback | prosecute
  • 用途:無名相簿採用的語法是CSS.而CSS的滑鼠游標是用ani.ico.cur等cursor檔案 並不能像java語法一樣用jpg或gif這樣滑鼠帶圖語法 軟體:Microangelo 載點1

  • [教學]製作CSS滑鼠游標 【ever780623】 at October 26, 2008 03:34 AM Trackback | prosecute
1 2 Next

Reply
1 2 3 Next
  • 1樓

    1樓搶頭香

    請問有什麼空間可以放...
    學校空間 還是GIGIGAGA還是...
    THX

  • sadjoeblack at July 26, 2004 09:55 PM comment
  • 2樓

    2樓頸推

    學校空間可以放
    我唸中興.就是放在學校的空間
    giga.seednet這些付費的空間應該也都可以用

  • 凱哥 at July 26, 2004 10:01 PM comment
  • 3樓

    3樓坐沙發

    真的是非常感謝你那麼詳盡的解說
    我逛過很多教學的網站,對於這個部分的講解都很模糊
    不知道該如何下手才好
    對於新手而言,真的是非常好的教材^^

  • schokolade at July 26, 2004 11:05 PM comment | email
  • 4樓

    福樓

    那ico在一般的免費空間就可以放嗎?謝謝

  • 格格 at July 29, 2004 11:40 PM comment | Homepage
  • 5樓

    專業的5樓

    當然還是不行
    我想啦....
    照理說是不行啦

  • keigo桑 at August 1, 2004 03:53 PM comment | Homepage
  • 6樓

    6樓

    HI, 凱哥~
    有人問我如何自製鼠標
    跟你借個連結請他連過來喲…
    跟你說一下…謝謝喲

    ^_____^

  • Kite at September 8, 2004 07:39 PM comment | Homepage
  • 7樓

    7樓

    呃...爲什麼我下載那個軟體不能開啟>   <

  • 小涵 at October 17, 2004 07:54 PM comment
  • 8樓

    8樓

    首先感謝這裡詳細的教學,
    讓我很快就能做好自己的滑鼠了^^

    可是...有個小怪的地方..
    我的滑鼠會"抖動"耶..= =

    感覺像是其中有個畫格裡面的東西位置偏掉..(不知道這樣說清楚
    嗎?)
    [這是我的:http://www.wretch.cc/album/sodabubble]
    請問是不是我哪裡沒注意到?o_O


    謝謝喔~~

  • sodabubble at October 19, 2004 09:10 PM comment | prosecute
  • 9樓

    9樓

    請問一下 為什麼gif設成的滑數都不會動 而且我只要設body的就不
    能設hover

  • nueenuee at October 23, 2004 10:42 AM comment | prosecute
  • 10樓

    10樓

    一定只能用這個軟體ㄇ???我只會photoshop...

  • at October 28, 2004 08:38 PM comment
  • 11樓

    11樓


    <script language="JavaScript">
    var no = 20; // snow number
    var speed = 1; // smaller number moves the snow faster
    var snowflake = "http://maggy.spps.tp.edu.tw/07平面插圖/01小
    圖/07植物水果/01樹葉/植物葉子1/15.gif";
    var ns4up = (document.layers) ? 1 : 0; // browser sniffer
    var ie4up = (document.all) ? 1 : 0;
    var dx, xp, yp; // coordinate and position variables
    var am, stx, sty; // amplitude and step variables
    var i, doc_width = 1024, doc_height = 764;
    if (ns4up) {
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
    } else if (ie4up) {
    doc_width = document.body.clientWidth;
    doc_height = document.body.clientHeight;
    }
    dx = new Array();
    xp = new Array();
    yp = new Array();
    am = new Array();
    stx = new Array();
    sty = new Array();
    for (i = 0; i < no; ++ i) {
    dx = 0; // set coordinate variables
    xp = Math.random()*(doc_width-50); // set position variables
    yp = Math.random()*doc_height;
    am = Math.random()*20; // set amplitude variables
    stx = 0.02

  • at October 30, 2004 04:58 PM comment
  • 12樓

    12樓

    那個軟體我下載後不能開啟...........怎辦=   =

  • 黑色琉璃瓶 at November 28, 2004 03:31 PM comment
  • 13樓

    13樓

    不好意思...
    我想請問一下...如果CUR檔案是放在GIGA的空間...
    那使用中華ISP的人...可以看的到嗎...
    謝謝...

  • willson225 at December 5, 2004 11:27 PM comment | prosecute
  • 14樓

    14樓

    想請問一下~我是用中華電信的網路
    所以有20M的個人網頁空間~
    可是我TRY了很久~~ 還是不知道怎摸把動畫滑鼠放上去
    可以交交我嗎??

    非常感激!!

  • 小潔 at January 27, 2005 09:40 PM comment
  • 15樓

    15樓

    hinet我沒有過耶
    瀏覽器上傳跟ftp上傳應該都可以吧

  • ppkeigo at January 28, 2005 01:30 PM comment | Homepage | prosecute
  • 16樓

    16樓

    凱哥~不好意思~
    能請問你一下瀏覽器上傳或是FTP上傳
    我要怎摸做呢?

    因為我對這方面不太懂~~謝謝你!!

    不好意思打擾你了!!

  • 小潔 at January 31, 2005 03:47 AM comment
  • 17樓

    17樓

    我建議你去查你空間给的詳細資料
    她應該都會有寫吧
    妳問我 我可能很難跟你說
    像ftp上傳 很簡單 可是要教的話要教很久喔
    建議你找身旁的朋友教你比較快

  • ppkeigo at January 31, 2005 11:29 PM comment | Homepage | prosecute
  • 18樓

    18樓

    突然發現yahoo的網頁空間可以放在檔案總管理耶...
    就用自己的帳號去申請一個網頁就好囉:D

  • seasoul at February 1, 2005 02:05 AM comment
  • 19樓

    19樓

    OKOK~~謝謝你了~凱哥^_^

  • joanio at February 1, 2005 11:51 PM comment | prosecute
  • 20樓

    20樓

    我在body裡面加上這一行
    cursor:url(" http://oz.nthu.edu.tw/~u931017/cur_g6.ani");
    可是游標都沒變ㄟ.........
    可以請問是哪裡有錯嗎
    我放圖的地方是學校的空間
    先謝過了m(__ __)m

  • jasteralan at February 2, 2005 06:52 PM comment | prosecute
  • 21樓

    21樓

    請問...

    下載之後變成無效資料夾ㄝ!!

    要怎麼用@@??

  • kangta1010 at February 17, 2005 10:59 PM comment | email | prosecute
  • 22樓

    22樓

    現在空間問題已改善
    應該OK了

  • ppkeigo at February 18, 2005 06:11 PM comment | Homepage
  • 23樓

    23樓

    下載完之後就安裝不上去的感覺ㄝ@@"

  • kangta1010 at February 24, 2005 11:47 PM comment | email | prosecute
  • 24樓

    24樓

    幫我做游標

  • 口愛ㄟ欣 at February 26, 2005 02:00 PM comment | email
  • 25樓

    25樓

  • at March 5, 2005 04:04 PM comment
  • 26樓

    26樓

    很抱歉~請問一下~
    我製作好了游標,也存檔了(存在我的電腦裡)~
    我要怎麼把他弄到網頁上呢?
    感激大大~^^~

  • zinc at March 7, 2005 06:42 PM comment | email
  • 27樓

    27樓

    你好 請問為什麼我用ani動畫滑鼠做好了 相簿卻沒辦法顯示呢 但是
    自己的電腦可以用

  • nueenuee at March 15, 2005 08:16 PM comment | Homepage | prosecute
  • 28樓

    28樓

    請問我圖畫好了,接下來是要上傳到IE嗎
    我傳到YAHOO/YAM相簿2都不行捏
    似乎是沒有支援這個檔案的類型
    那我該怎麼辦呢?? ^^

  • TuMePlais530 at March 28, 2005 12:13 PM comment | email | prosecute
  • 29樓

    29樓

    那個.....不好意思打擾一下~^^
    我已經上傳到學校的網路空間了..
    我自己看的到滑鼠的游標有變
    可是我同學都沒有看到
    然後我再去修改一次css~
    就變的連我自己都看不到了~
    可是明明都還是一樣的語法耶~
    事出了什麼問題呀???????

  • emilykila at April 3, 2005 09:52 PM comment | email Homepage | prosecute
  • 30樓

    30樓

    那自己想要ㄉ圖就不行製成動態ㄉ滑鼠ㄌㄟ><
    我只想要我ㄉ花花換顏色而已阿....怎ㄇ這ㄇ難搞阿><

  • peaceq at April 16, 2005 09:21 PM comment
1 2 3 Next

Only friends can post a comment, Login first

誰來收藏
Loading ...