マウスオンで画像変更＆リンク

写真Ａの上にマウスを乗せると、写真Ｂに変更

更に、クリックすると、リンク先へ移動する。

下記のタグに画像ＵＲＬを入れる。

<a href="リンク先のURL">

<img src="画像１ＵＲＬ"

onmouseover="this.src='画像２ＵＲＬ';"

onmouseout="this.src='画像１ＵＲＬ';">

画像を用意する。

http://u.jimdo.com/www59/o/s0830e0ee62dfee6e/img/i1f4270342bf4a6f8/1441351705/std/image.jpg

画像のＵＲＬ

左写真のＵＲＬ

http://u.jimdo.com/www59/o/s0830e0ee62dfee6e/img/i1f4270342bf4a6f8/1441351705/std/image.jpg


右写真のＵＲＬ

http://u.jimdo.com/www59/o/s0830e0ee62dfee6e/img/i3e8e2686bf83b095/1441351734/std/image.png

タグにＵＲＬを入れる

<a href="http://cafe-kibougaoka.jimdo.com/lp%E5%88%B6%E4%BD%9C%E4%BB%A3%E8%A1%8C/">

<img src="http://u.jimdo.com/www59/o/s0830e0ee62dfee6e/img/i1f4270342bf4a6f8/1441351705/std/image.jpg"

onmouseover="this.src='http://u.jimdo.com/www59/o/s0830e0ee62dfee6e/img/i3e8e2686bf83b095/1441351734/std/image.png';"

onmouseout="this.src='http://u.jimdo.com/www59/o/s0830e0ee62dfee6e/img/i1f4270342bf4a6f8/1441351705/std/image.jpg';">

上記タグをウィジェットを使って挿入する

<a href="リンク先のURL">

<img src="画像１ＵＲＬ"

onmouseover="this.src='画像２ＵＲＬ';"

onmouseout="this.src='画像１ＵＲＬ';">

<a href="リンク先のURL">

<img src="画像１ＵＲＬ"

onmouseover="this.src='画像２ＵＲＬ';"

onmouseout="this.src='画像１ＵＲＬ';">