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楽しいぞ!

Tags: ,

コメントする

Grow!

About this entry

JavaScriptによる簡単な画像切り替え

Posted in 6 / 21 / 2008

Tags: ,

Bookmark

Share