ファビコンとカーソル

先日マウスポインタを設置してみました

そのときIE系のブラウザなら見られるけどFirefox系のブラウザでは見られないと書いたんです

でも・・ブログ読んでくれたから教えていただいて・・・Firefoxでもマウスポインタが使えるということを知り早速取り入れてみました

何のことはない・・・

cursor:url(カーソル画像のおいてあるアドレス),auto;

そう・・このautoが大切だったのです

このタグをつけることによりどのブラウザからでもマウスポインターが見えることがわかりました

サファリ、スレイプニル、Firefox３、Google Chrome　の４ブラウザで確認しました

今はきちんと動いてると思うけど

これにはてこずったぁ～～しばらくCSSはいじってなかったので基本的なことをすっかり忘れてたんですよ

ココから失敗談・・・

まず最初に私のバイブル（笑）

TAGindexさんのサイトに行きおさらいです

(^_＾）3　フムフム。　,auto　をつければよいということがわかり

早速つけてみました

確認しに行くと・・あれ？出てない

全部のブラウザ試してもだめ・・・どうしたのかと

もう一度ラヴォちゃんのCSSを確認

(・_・ゞ－☆　autoがaoutになってるじゃん！！

基本中の間違い・・・

早速直して確認

まだだめだぁ～この間４ブラウザ開きっぱなしで確認作業

IEですら見えません

もう一度ラヴォちゃんCSSへ

なんと！！　「、」が大文字じゃん！！これも基本中の基本！！

早速直して　確認へ

ウーン ／(-_-)＼　Firefox以外はみんな見えてるのに・・・

ココで一人で納得です

「Firefox1.5には対応してると書いてあったから　Firefox３には対応してないんだ」

これで納得してモコチャンのブログを見に行ったのです

ところが・・モコチャンはFirefox３でもマウスポインタが見えてるの・・・

また悩んださぁ～

そこで・・二人のCSSをコピペして比べることに

cursor:url(ravo),auto；

cursor:url(moko),auto;

ぱっと見・・長さが違う・・・そうなんです

ラヴォちゃんのほうには;の前に半角の空白が・・・

たったこれだけの事で見えなくなるんですよね

Firefoxはタグには厳格です（⌒▽⌒） ケラケラ

皆さん！！気をつけましょうね～～～

そのほか今回はファビコンもつけてみました

全員分ね

ファビコンってこういうものよ

これもてこずったぁ～

設置タグは簡単なんです

<link rel="shortcut icon" href="ファビコンのURL" type="image/vnd.microsoft.icon"/>

<link rel="icon" href="ファビコンのURL" type="image/vnd.microsoft.icon"/>

これをHTML編集を開いて

そこの１４行目あたりに

<link rel="shortcut icon" href="<% site_info.blog_url %>/_common/favicon.ico" />

こういうところがあるのでこれと入れ替えればいいのです

結構てこずったんですが何とか設置することができました

ファビコンの名前はfavicon.icoにするといいみたいです

別に好きな名前をつけても大丈夫なようなことが書いてあったのですが

なんかうまく行かなくて

４種類のファビコンを使わなくちゃいけなかったから

それぞれフォルダで管理しました

ホムペアドレス/de-de-favicon/favicon.ico

ホムペアドレス/ravofavicon/favicon.ico

ホムペアドレス/kurofavicon/favicon.ico

ホムペアドレス/mokofavicon/favicon.ico

こんな感じにね

ココで注意点！！

スレイプニルはファビコンのキャッシュがほかと違うところにあるらしく

そのキャッシュを消すには

[ツール]→[Sleipnir オプション]のクライアント→終了 

faviconのキャッシュにチェックを入れてその後再起動。

この手間かけないとあたらしくはなりませんでした

　　　　

結構面倒くさかったのが画像の準備でした

ファビコンもマウスポインタも透過処理した画像を使いたかったので

大変でした

私が使ってるフォトショップエレメントは透過GIF画像で保存しても

実際使うと背景が残っちゃうのです

こんな手順でやりました

フォトショップエレメントで透過画像を作り透過GIF画像で保存

無料の画像処理ソフト「IrfanView」で拡張子.icoで保存

そのとき大きさを１６×16で保存すればそのままファビコンに使えるけど

カーソルに使うためにはもう一つ変換しないといけないのよ

それは「彩彩畑」というフリーソフトです

これを使ってcur画像を作りました

いろんな画像処理ソフトがあるみたいだけど

今のところこれらを使ってます

モット簡単に作れるようになればいいのにとおもいますが

結構苦労しましたファビコンとカーソル変更でした

近頃のラヴォちゃん

先日のヤミーshopではなんも買ってもらえなくてへそ曲げてるかと思いましたが

そんなことも無く

２４日

満足げにダイヤを見ています

すばらしく素敵な経験値！！　きれいだね～思わずキャプチャ！！

タグ：ファビコン カーソル 成長 ダイヤ

コメント 2

こんにちは☆
うわ！凄い、Firefoxでもラヴォちゃんが出てる！！
あと、ファビコンいいですね♪
難しそう～・・・いろいろ見させてもらいますね！！
あと、ラヴォちゃんの経験値が凄いですね！！
偶然でもなかなか見れないと思います(≧▽≦)ノ by qoo2qoo (2008-09-26 19:06) 

☆qoo2qoo さんへ

はい！！頑張りましたよ　(*^.^*)エヘッ
qoo2qoo さんもつけてみて
カーソルだけならすぐだよ by daisy_ma (2008-09-27 11:41)