Webカーソル
このページのカーソル。「なにこれ〜!?」って驚かれた方は
WindowsのIE6ブラウザでご覧になってますね?(^^)
ネットスケープや、IE6未満の方へ
いわいるマウスストーカーという、カーソルに
飾りをつけるようなものではなく、カーソルそのものが
これに変わってるんです。
|
前回のお気に入りアイコンに続いて、WEB素材では無縁だった
拡張子 .cur や .ani のPCのカーソル用ファイルをHPでも使っちゃおう!ってお話しです。
その他に、アイコンファイル .ico も利用可能。
スタートボタン → プログラム → エクスプローラを開いて、
Cドライブ → Windows → Cursors のフォルダの中を覗いてみてください。
上記の拡張子のファイルがごっそりありますね(^^)
皆さんの普段使っているカーソルもこの中に見つかるかな?
自分のPCをカスタマイズするのに、デスクトップテーマなど配布しているところで
ちょっと変わったのを貰ってきて変える人も少なくないでしょう。
ちなみに、PCのカーソルを変更するのは、
スタートボタン → 設定→ コントロールパネル →
マウス の ポインタ で変えたい元のカーソルを選び、
参照で、すでに保存してあるカーソルファイルを指定します。
さて、話がそれましたが、このカーソルは今までWeb上では表示されない、
HPでは使えないもの、という常識がありました。
IEブラウザ6.0バージョン以降、これを表示することが出来るようになったのです。
その方法は・・・
1) .cur 又は .ani .ico ファイルをつけたいページと同じ場所にアップします。
(他のフォルダにアップしてもできますが、相対パスといって慣れない方には
ややこしい指定をしなくてはならないので、同じ場所のが簡単)
2)ページ内のソースの上の方、<HAED>〜</HAED>の間に下記のスタイルシートを埋めてください。
<style type="text/css">
body {cursor:url(○○.cur);}
</style>
これだけです。アニメーションカーソル(.ani)のファイルの場合は、
body {cursor:url(○○.ani);}
アイコンファイル[※HP用アイコンの事ではない](.ico)のファイルの場合は
body {cursor:url(○○.ico);} ですよ。
他にもリンク文字、画像の上、テーブル内など、
場所を限定してそのカーソルを変化させたい場合などは
a {cursor:url(○○.cur);} ・・・リンク文字
img {cursor:url(○○.cur);} ・・・画像
table {cursor:url(○○.cur);} ・・・テーブル内
これらの指定を追加又はbodyと交換します。
※個別のタグ内styleオプションでも可能。
IEのバージョンは、ツールバーから ヘルプ → バージョン情報 で見れます。
※IEは、セキュリティ面でも5.5SP2以上を使うようマイクロソフトでも推奨しています。
Internet Explorer Home Page
こちら↑からInternet Explorerのアップデートをおすすめします。
今日のコラムは長かったです(^^;
最後まで読んでくださってありがとうございます。
Webカーソルは自分で作れないと言う方もいらっしゃると思うので、
NOELからプレゼントです。
通常のWEB素材とは違い、↓に見えるのはサンプル画像です。
個別のダウンロードは「 DL 」の文字の上で右クリック→対象をファイルに保存
「一括ダウンロード」はそのままクリックして保存してください。
いずれは、このWEBカーソル素材や、お気に入りアイコンもコンテンツとして独立させて
配布をしていこうと思ってます(^^)
*------------------------------------------------------------------*
HPではなくパソコンのポインターを変えたい場合
コントロールパネル → マウス → ポインタ
ここで取り替えたい元のポインターを選び、「参照」であらかじめ保存してあるカーソルを選びます。
拡張子が .cur 又は .ani のものが有効です。
'03.06.29 追記 & 一括ダウンロードに おまけカーソルを追加
NOEL
'02.08.25
|