JoyWave便利箱「オンマウスで背景色変化（入れ替え）」

オンマウスで背景色変化（入れ替え）

その他に戻る

■実際にどうなるの？

下のボタンにマウスを乗せてください。

乗せたときだけ・・・

● ● ● ● ● ●

乗せて離れても・・・

■ ■ ■ ■ ■ ■

ページ背景色が変わります。
上の例：「●」「■」は文字ですが、画像でも構いません。

■ソース

乗せたときだけ・・・（赤色の場合）
<font style="font-size:28px" color="#ff3333" onmouseover="document.bgColor='#ffdddd'" onmouseout="document.bgColor='#f9f0ff'">●</font>

乗せて離れても・・・（赤色の場合）
<font style="font-size:28px" color="#ff3333" onmouseover="document.bgColor='#ffdddd'" onmouseout="document.bgColor='#ffdddd'">■</font>

■どうするの？

<body>～</body>間に「■ソース」の青字部分のどちらかを書きます。

font-size:28px	文字の大きさです。数字を大きくすると文字が大きくなります。
color="#ff3333"	文字の色です。
onmouseover="document.bgColor='#ffdddd'"	乗せたときの色です。onmouseoverは「マウスを乗せる」意味。bgColorの「C」は大文字で、小文字では変化しません。
onmouseout="document.bgColor='#ffdddd'"	離れたときの色です。この色を元の色にすると、乗せたときだけ色が変わります。 onmouseoverは「マウスが離れる」意味。bgColorの「C」は大文字で、小文字では変化しません。
■	ここでは記号のように使いましたが、文章でも大丈夫です。

実際に利用されて「これは良かった」内容がありましたら、教えてください。
少しずつ充実させていき、本当の意味での「便利箱」にしたいと思います。

その他に戻る