layers

カーソルを合わせると背景が変わる
ここでは画像を色版として使用しています。
[サンプル]

<HTML>
<HEAD>
<TITLE>背景の入れ替え</TITLE>
<SCRIPT LANGUAGE='JavaScript'>
<!--
	if (document.layers) {
		captureEvents(Event.RESIZE);
		onresize = myResize;
	}

function myResize()
	{
		location.reload();
	}

function changeBack(url)
	{
		if (document.layers)
			document.layers['BODY'].background.src = url;
		else if (document.all)
			document.body.background = url;
	}
//-->
</SCRIPT>

</HEAD>
<BODY BGCOLOR="#ffffff" TEXT="#000000">

<FONT SIZE=2>カーソルを合わせると背景が変わります。</FONT><BR><BR><BR>
<LAYER ID='BODY' WIDTH=100% HEIGHT=100% LEFT=0 TOP=0>
<A HREF='JavaScript:;' onMouseOver='changeBack("source/wall_a01.gif");' onMouseOut='changeBack("http://www.geocities.jp/server-errors/not_found.html");'>
<IMG SRC='source/wall_a01.gif' WIDTH=20 HEIGHT=20 BORDER=0></A>
<A HREF='JavaScript:;' onMouseOver='changeBack("source/wall_a02.gif");' onMouseOut='changeBack("http://www.geocities.jp/server-errors/not_found.html");'>
<IMG SRC='source/wall_a02.gif' WIDTH=20 HEIGHT=20 BORDER=0></A>
<A HREF='JavaScript:;' onMouseOver='changeBack("source/wall_a03.gif");' onMouseOut='changeBack("http://www.geocities.jp/server-errors/not_found.html");'>
<IMG SRC='source/wall_a03.gif' WIDTH=20 HEIGHT=20 BORDER=0></A>
<A HREF='JavaScript:;' onMouseOver='changeBack("source/wall_a04.gif");' onMouseOut='changeBack("http://www.geocities.jp/server-errors/not_found.html");'>
<IMG SRC='source/wall_a04.gif' WIDTH=20 HEIGHT=20 BORDER=0></A>
<A HREF='JavaScript:;' onMouseOver='changeBack("source/wall_a05.gif");' onMouseOut='changeBack("http://www.geocities.jp/server-errors/not_found.html");'>
<IMG SRC='source/wall_a05.gif' WIDTH=20 HEIGHT=20 BORDER=0></A>
<BR>
<BR>
	
</LAYER>
</BODY>

</HTML>

一つ前に戻る