【飾付VOL１０】
- さあ！みなさん飾り付けはうまくいっていますか！
今回は、私のページでもところどころに表示していますが、カーソルアイコンについてお話していきましょうか！
楽天広場でカーソルアイコンを表示するには、他のブラウザに表示する方法とは少し異なります。
直接、編集ページにSTYLEで書き込まないといけません。
カーソルのアイコンは、素材屋さんからDL（ダウンロード）してそれをアップロードしなければWEB上では表示できません。
また、画像のように見えますが、アイコン独自の｢拡張子」を持っています。
この、 DLとアップロードの仕方 については、あとで、詳しくお話しましょう。
まずは、DLもアップロードも必要ない、カーソルの形状を変えることからやってみましょう！(￣m￣*)V
では！始まり始まり・・・・（*^_^*）
まずは、テキストの部分だけカーソルの形状を変えて見ましょう。
<font style="cursor: wait ;"> これが砂時計です。 </font>
<font style="cursor: help ;"> これは？マーク入り⇒です。 </font>
お判りでしょうか？(*^^)v
ではいくつか属性のタグを乗せてみましょう。
各属性にカーソルを当てて見て下さい。カーソルの形状が出ます。
crosshair 十字型形状
pointer アンカー上にある事を示します形状
move 対象が移動可能の形状
e-resize 右方向にリサイズ可能を示す形状
ne-resize 右上方向にリサイズ可能を示す形状
nw-resize 左上方向にリサイズ可能を示す形状
n-resize 上方向にリサイズ可能を示す形状
se-resize 右下方向にリサイズ可能を示す形状
sw-resize 左下方向にリサイズ可能を示す形状
s-resize 下方向にリサイズ可能を示す形状
w-resize 左方向にリサイズ可能を示す形状
text 文字を範囲指定できることを示す形状
ここから下は、Internet Explorer ６ しか表示できません。
all-scroll ページが上下左右スクロール可能を示す形状
col-resize 左右にリサイズ可能を示す形状
no-drop ドラッグした対象がドロップできない領域を示す形状
not-allowed 要求されたアクションが動作しない事を示す形状
progress バックグラウンドで処理が行われている事を示す形状
row-resize 上下にリサイズ可能を示す形状
vertical-text 縦書きテキストを範囲指定できることを示す形状
url(～URL～/elogo.cur) 拡張子が「cur」のみで表示します。
この「elogo」は一度アップロードしないと表示しません。
ページ全体、またはボックスの中全体の時は、編集ページの一番上に貼り付けます。
このようにします。
<font style="cursor: wait ;">
ここが本文とします。
どんどん改行して書いていきます。
</font>
一番下に </font> を忘れないように！
このタグは、fontにSTYLEで属性を指定していますから、テキストやスペースがないところでは、形状が出ないことをご承知おきください。
FONTだけではなく他のタグで表示することも出来ます。
<DIV> <UL> <CENTER> などがあります。
また、楽天でページすべてにカーソルの形状を出したい時には、そのページに背景色や背景画像を指定して、そのタグの中に、 style="cursor:wait;" を入れ込みます。
日記では、このやり方が出来ますが、各フリーページでは個々に背景色や背景画像が指定できません。
しかし、TABLE のタグで背景画像をフリーページに指定しその中に入れることは出来ます。
私の プチ講座 にそれは紹介しております。興味のある方は、いってみてくださいませ。
「カーソルアイコン」の素材は実にたくさん提供されています。
皆さんも「カーソルアイコン ホームページ素材」などで検索してみてください。
たくさんの素材屋さんが見つかると思います。
一つ紹介しておきましょう。 http://www.asahi-net.or.jp/~cb9i-kn/index.htm
ここのサイトを使いまして、あとでダウンロードの仕方を説明します。
まず、皆さんに知って置いていただきたいのは、カーソルアイコン素材は、画像のファイルとは違うということです。
画像は ＪＰＧ．ＧＩＦ．ＰＮＧ．ＢＭＰ．
などの「拡張子」で表されます。
しかし、カーソルアイコンの「拡張子」は ＡＮＩ．ＣＵＲ．
などです。
画像とはまったく別なものです。そのことをまずご理解ください。
素材屋さんからのＤＬも、普通の画像のＤＬと違います。
ほとんどが exe. ファイルになっています。圧縮ファイルです。
素材屋さんのところに表示してある雛形はみなＧＩＦなどに変換してあります。
ですから、画像をＤＬするときのように右クリックで、「名前を付けて保存」してもカーソルアイコンとしては使えません。
それはただの GIFの「拡張子」を持った画像だからです。
お判りでしょうか・・・・・お願いわかって(-_-;)
- 先にも述べましたように素材屋さんからのＤＬは、普通の画像のＤＬと違います。
ほとんどが exe.
ファイルになっています。圧縮ファイルです。
では、具体的にやって見ましょうか。
一つ例を出して、サイトからダウンロードしてみましょう。
http://www.asahi-net.or.jp/~cb9i-kn/index.htm
↑このサイトでカーソルアイコンをＤＬして見ましょう。
まずは、 アニメカーソルその１ アニメカーソルその２ とありますが、それをクリックしますと、ＤＬ用のページに飛びます。
そうすると雛形がいっぱいありますが、それはみなＧＩＦ画像です。
それを右クリックで保存しても、カーソルとしては使えません。
画像の右端に 「ファイル名」 ＊＊＊＊＊.exe というのがあり、圧縮ファイルへのリンクが張ってあります。
それをクリックしますと、「ファイルのダウンロード」というフロートパネルが出てきます。
「保存」を押しますと、また、「名前を付けて保存」というパネルが出てきます。
そこでデスクトップにでも保存先を指定し保存します。
そうしますと、デスクトップにレンジのアイコンが出来ると思います。
それがカーソルアイコンの入っている圧縮ファイルです。自動解凍になっていますから
そのアイコンをダブルクリックしますと、また、フロートパネルが出てきまして、解凍先を聞いてきます。
「参照」からマイドキュメントなどを選びまして、「ＯＫ」を押します。
そうすれば、カーソルアイコンが指定したところに現れるはずです。
DLしたアイコンをダブルクリックしてみてください、「表示できません」といってくると思います。
それがカーソル用のアイコンなのです。
あとは、カーソルアイコンの「拡張子」である ANI. や CUR. をアップできるサーバーにそのアイコンを指定しまして、アップロードすればいいのです。
ＤＬしたこの「カーソルアイコン」はそのままですと貴方のＰＣでしか、表示することが出来ません。
みなさんのWEB画面で見てもらうには、この「カーソルアイコン」のファイルをＷＥＢ上に、 「アップロード」 しないといけません。
どういう事かといいますと、みなさんは、楽天の「画像の倉庫」から自分のフォルダにある画像を、楽天のサーバーで、ＷＥＢ上に乗っけていますよね。ＷＥＢ上に画像をアップしているから、みなさんに、貴方の画像が見てもらえるのです。しかし、楽天には画像をアップする「アップローダー」しかありません。
ANIやCUR
の拡張子をアップすることは出来ないのです。
じゃあどうするかといいますと、「カーソルアイコン」の拡張子である ANIやCUR
をアップできる、他の無料のサーバーを登録しまして、そこから、「カーソルアイコン」のＵＲＬを貰い、楽天上からリンクを貼り、表示するのです。
簡単に言えば、楽天上に「カーソルアイコン」を表示するために、他のサーバーに間借りするのです。
では、具体的に他のサーバーを紹介しましょう。
楽天サイトにも繋がりの深い関連会社の 「infoseek ISWEB」
です。
http://isweb.www.infoseek.co.jp/Icont?pg=iw_top.html&sv=IW
他にも無料のＨＰサイトは、たくさんあります。
私の 【アップロードとは？】
のページに２～３サイトを紹介しておりますから、興味のある人はいって見てください。
さあ！みなさん登録はできましたでしょうか？
では、 「infoseek ISWEB」
のトップページの左上に｛iswebライト管理画面｝というのがあると思います。
それをクリックしますと、ログイン画面に飛ぶと思います。
IDとパスワードを入れまして、ログインします。左に 管理メニュー
というのがありますね。そこの一番上に、 「ファイルマネージャー」
というのがあると思います。
これが、 「アップローダー」
です。ＷＥＢ上に 「画像」「ＨＴＭＬテキスト」「音楽」「カーソルアイコン」等
などを、アップロードしてくれます。
一番下に ● ファイルのアップロード というのがあると思います。それがアップローダーです。楽天の画像のアップローダーと同じものです。一度に５つのファイルが アップロード できます。
[参照］をクリックしますと、「ファイルの選択」というフロートパネルが出てきます。
貴方がＤＬした「カーソルアイコン」のファイルを出しまして、アップするアイコンをクリックで指定して「開く」を押します。
ファイルマネージャー
の「ファイル１」にファイル名が入ります。
その下にある、[アップロード開始]をクリックしますと、 アップロード
は終了です。
ファイルマネージャー の上に「ファイルの一覧の表」がありますが、そこにアップした、「ファイル名」が載っているはずです。
例えば私の場合では、 「manma04.ani」
という風に！
あとは、貴方の「infoseek ISWEB」のＵＲＬアドレスにこの「カーソルアイコン」のファイルの名前を継ぎ足せばいいのです。
例えば、私の「infoseek ISWEB」のＵＲＬアドレスは、
http://gtone.hp.infoseek.co.jp/
とします。これに先ほどアップした、「カーソルアイコン」ファイルの名前、 「manma04.ani」
を入れます。
そうすると、こうなりますね。
http://gtone.hp.infoseek.co.jp/manma04.ani
これが、アップロードした「カーソルアイコン」ファイルのＵＲＬになります。
お分かりでしょうか・・・・(-_-;)・・・お願い分かって・・・・・（*^_^*）
URLの出し方は分かりましたか？
まずは、上で紹介しましたように FONT にSTYLEシートでアイコンを表示してみましょう！
<FONT style="cursor:url(ここにカーソルアイコンのURL)"> マンマちゃんを出してみましょう！
</FONT>
出ているでしょうか・・・・マンマちゃん！(￣m￣*)V
日記の中にアニメーションカーソルなどを入れるには、ＴＡＢＬＥなどを使ってＳＴＹＬＥで指定します。
↓このように書いています。
<TABLE ALIGN="CENTER" BORDER="0" WIDTH="100%" HEIGHT="300" BGCOLOR="#E4FCFB" style="cursor:url( http://ここにアニメポインターのＵＲＬ/butasan.ani );" ><TR><TD ALIGN="left" valign=top><UL>
ここに本文を書きます。
ＴＡＢＬＥが判るようにＢＧＣＯＬＯＲ（背景色）を入れてあります。
高さ（ＨＥＧＨＴ）は３００ＰＸにしています。
</UL></TD></TR></TABLE>
-
-
- 妖怪ウォッチのグッズいろいろ
- 今日もよろしくお願いします。
- (2023-08-09 06:50:06)
-
-
-
- どんな写真を撮ってるの??（*^-^*）
- そや堺 #219
- (2024-11-27 21:32:18)
-
-
-
- 美術館・展覧会・ギャラリー
- 激レアな巻物見ちゃった
- (2024-11-27 09:33:08)
-
