(CSS編集-13)カーソルポインタの変更

テーマ:

ここのブログを見て頂いたらおわかりだと思いますが、

カーソルポインタが、キラキラかわいくなっています。


このCSS編集を説明します。


まず、カーソルポインタ用の画像を用意します。

カーソル用の画像は、拡張子が【.cur 】or【.ani 】の物になります。


その画像を・・・・・ 画像フォルダにUP・・・・・ 


できないんです・・・・・ Σ(゜ロ゜;) 


この2つの拡張子は、アメブロの画像フォルダにUPできないようです。

と言う事は・・・ 別の場所(サーバー)にUPした画像をこちら(アメブロ)に引っ張ってくるようになります。

私は、別のHPを持っているので、そちらのサーバーにUPした画像( .cur / .ani )を使っています。


アメブロの画像フォルダにUPした、【gif】や【jpg】でも試してみましたが、

この拡張子ではカーソルの画像の変更はできませんでした。

HPを実際にOPENしなくても、プロバイダ契約をされている方なら、どなたでも、

のHPスペースを持っておられるのではないでしょうか?

プロバイダによって設定方法は違いますが、そんなに難しくはないと思います。


画像をUPされるには、こちらのフリーソフトがおすすめです → fffftp

私も使ってます(*^-^*)



①サーバーにスペースを確保する


②FTPソフトを使って、画像をアップロードする



/* ----------------------- common ----------------------- */


この間のどこでもいいので、下記のタグを打ち込みます。


/* ----------------------- header ----------------------- */



a{cursor:
url("カーソルポインタの画像のURL"); ←参照①
}
body{cursor:
url("カーソルポインタの画像のURL"); ←参照②
}



<参照①>

リンクの上にポインタが来たときの画像をかえる


<参照②>

ページ全体のポインタの画像をかえる


片方だけ変えたいときは、変えたい方のタグだけ打ち込みます。


こちらのアイコンは、Angels  からお借りしました。

設定の仕方も、Angelsさんを参考にさせていただきました(* ̄∇ ̄*)。


AD