JavaScriptによる簡単な画像切り替え
6 / 21 / 2008
アニメーション等は使わずに、単純に画像を置き換えるやり方です。
<!–JavaScript側–>
<script type=”text/javascript”>
<!–
function showimg1(){
document.hogeimg.src = “画像1のURL”;
}function showimg2(){
document.hogeimg.src = “画像2のURL”;
}function showimg3(){
document.hogeimg.src = “画像3のURL”;
}
–>
</script><!–HTML側–>
<img src=”デフォルト画像のURL” name=”hogeimg”>
<input type=”button” onclick=”showimg1()” value=”画像1″>
<input type=”button” onclick=”showimg2()” value=”画像2″>
<input type=”button” onclick=”showimg3()” value=”画像3″>
簡単ですね。function showimg4(),function showimg5()と増やしていけばどんどん増やせます。僕はこれをDashboardWidgetのスキン変更とかに流用しました。
Dashcode楽しいぞ!
