jquryを利用した画像切り替え
jqury(1.3)を利用しマウスオーバー,アウトで画像切り替えを行おうとしています。
マウスオーバーで特定の箇所に画像入れ替えする事はできたのですがマウスアウトで最初の画像に
戻すにはどうすればいいのでしょうか?具体的には・・・
<div><img id="target" src="最初の画像" /></div>
<div class="thumbnail">
//以下の画像はマウスオーバーでtargetに拡大表示、マウスアウトで拡大画像を消し最初の画像に戻したい
<a href="1の拡大"><img src="1の縮小" /></a>
<a href="2の拡大"><img src="2の縮小" /></a>
<a href="3の拡大"><img src="3の縮小" /></a>
</div>
という具合です。jsは以下のようにしたところマウスオーバーで切り替えは可能になったのですが戻すことができない状態です。
.hover(
function(){// マウスオーバー時
$(this).fadeTo(200, 1.0);
var changeSrc = $(this).attr("href");
$("#target").attr("src", changeSrc);
},
function(){// マウスアウト時
$(this).fadeTo(500, 0.8);
//ここで戻す処理をすると思うのですが方法がわかりません
}
)
詳しい方がいらっしゃいましたら宜しくお願い致します。
補足
IE8やIE9でIE7互換モードで拡大縮小すると 「教えてgoo」の画面では、文字がずれるのでしょうか? それともずれないのでしょうか? どうなるのか結果を是非教えてほしいのですが、 よろしくお願い致します。<(_ _)>