+++例として表示している画像はフリー素材ではありません+++

オンクリック画像１
(クリックすると表示)

この文字クリックして下さい♪


<span onClick="document.all.item('moji1').style.visibility='visible'"> この文字をクリックして下さい♪ </span> <div ID="moji1" style="visibility:hidden;"> <img src="画像ＵＲＬ"> </div>







オンクリック画像２
(クリックすると非表示)



<span onClick="this.style.visibility='hidden'"> <img src="画像ＵＲＬ"> </span>







オンクリック画像３
(文字をクリックすると画像を表示、表示された画像をクリックすると非表示)

この文字をクリックして下さい♪


<span onClick="document.all.item('moji2').style.visibility='visible'" onClick="document.all.item('moji2').style.visibility='hidden'"> この文字をクリックして下さい♪ </span> <Br><Br> <div ID="moji2" onClick="document.all.item('moji2').style.visibility='hidden'" style="visibility:hidden;"> <img src="画像ＵＲＬ"> </div>







オンクリック画像４
(画像をクリックすると画像を表示、表示された画像をクリックすると非表示)




<span onClick="document.all.item('moji3').style.visibility='visible'"> <img src="表示させる画像URL"> </span> <Br><Br> <div ID="moji3" onClick="document.all.item('moji3').style.visibility='hidden'" style="visibility:hidden;"> <img src="クリックすると消える画像URL"> </div>







オンクリック画像５
(クリックするとステータスバーに文字を表示)



<span onClick="status='ステータスバーの文字'"> <img src="クリックする画像ＵＲＬ"> </span>







オンクリック画像６
(クリックすると画像変更)



(ここでは[画像１]は猫、[画像２]はバナー)
<img src="画像１ＵＲＬ" onClick="this.src='画像２ＵＲＬ'">







オンクリック画像７
(クリックするとページの背景色を変更)



背景色はブラウザの「更新」をクリックすると元に戻ります <img src="画像ＵＲＬ" onclick="document.bgColor='変える背景色'">







オンクリック画像８
(オンクリック画像７の応用)



背景色はブラウザの「更新」をクリックすると元に戻ります <img src="画像１ＵＲＬ" onclick="document.bgColor='背景色１'"> <img src="画像２ＵＲＬ" onclick="document.bgColor='背景色２'"> <img src="画像３ＵＲＬ" onclick="document.bgColor='背景色３'">







オンクリック画像９
(クリックするとページの背景画像を変更)




背景画像はブラウザの「更新」をクリックすると元に戻ります <img src="クリックする画像URL" onclick="document.body.style.backgroundImage='url(背景にする画像URL)'">