検索サーチエンジンと動画リンク集byねっとねこ

画像にマウスポイントを乗せると違う画像が表示されるタグ

画像にマウスを当てると別の画像に変わるというタグの紹介です。

ここで使用する onmousタグは、WINDOWSの IE 6.0 7.0 にて
表示確認をしています。古いバージョンの IE や MAC専用の
ブラウザでの表示確認は しておりませんので、正しく表示され
るか?おかしな表示になるか?は ご自身で確認してください!

画像にマウスを乗せると画像が変わるタグの説明

画像の上にマウスポイント置くと、違う画像が表示されるタグ。
タグだけなので、簡単です。 参考にしてください!

 画像にマウスを乗せて見て

画像をポイントした時に 画像が変わるタグです。
エリア内で 右クリック→ コピー

<img src="18.jpg" は 最初に表示されている画像です。
onmouseover="this.src='10.jpg'" は マウスが乗った時の画像
onmouseout="this.src='18.jpg'" は マウスが離れた時の画像

ここでは、最初の画像とマウスが離れた時の画像と同じ画像を
使っています。 このタグは、いろいろと応用が出来ます。

 画像にマウスを乗せて見て

急に大きくなったら、ちょっと びっくりします。(笑)
いろんな画像を組み合わせて、遊んで見ましょう♪ (^^*

そうそう、よく リンクの画像にも使われています。
下の画像に、マウスを乗せてください。 リンク用





クリックすると、HOMEへ戻るので クリックしないでね!
同じような、Javaスクリプトもあるけれど、タグの方が
簡単にできて良いと思います。

一応、タグを入れておきます。
エリア内で 右クリック→ コピー

色違いの、同じサイズの画像を使っています。
リンクとして使う時は、border="0" を、つけましょう!

おしまい。。。








Copyright © 2008 - 2009 ねっとねこ Net-NekoProduction. All Rights Reserved.アクセスランキング