这个函数帮忙看看呗

kiba518 2010-01-24 11:08:43

<style>

.kcon{ width:550px; border:1px solid #eeeeee; height:228px;}

.kleft1{ width:405px; height:222px; float:left; padding:3px;}

.kleft2{ width:405px; height:222px; float:left; padding:3px; display:none} 

.kright{   float:right; height:222px; padding:3px; width:127px}

.krnt{margin-top:4px; margin-bottom:5px;}

.krn{margin-bottom:5px;}



.kright a{ display:block;border:1px solid #eeeeee; color:#000000; text-align:center; width:125px; height:49px;line-height:49px; text-decoration:none;}

.kright a.ka:hover{ background-color:#ad2323;color:#FFFFFF;}

.ka{}

.ka2{ background-color:#ad2323;color:#FFFFFF;}

</style>

</head>



<body>



<div class="kcon">

<div id="kl0" class="kleft1"><img src="a.jpg"></div>

<div id="kl1" class="kleft2"><img src="b.jpg"></div>

<div id="kl2" class="kleft2"></div>

<div id="kl3" class="kleft2"><img src="d.jpg"></div>



<div class="kright">

	<div id="kr0" class="krnt"  onMouseMove="chang(0)"  onMouseOver=""="over(0)"><a class="ka" href="#" >第一个</a></div>

	<div id="kr1" class="krn" onMouseMove="chang(1)"  onMouseOver="over(1)"> <a class="ka" href="#" >2</a></div>

	<div id="kr2" class="krn" onMouseMove="chang(2)"  onMouseOver="over(2)"> <a class="ka" href="#" >3</a></div>

	<div id="kr3" class="krnd" onMouseMove="chang(3)"  onMouseOver="over(3)"><a class="ka" href="#" >4</a></div>

</div>

</div>

<script language="javascript">

function chang(n)

{

	for(var i=0; i<4;i++)

	{

	var id='kl'+i;

		if(i==n)

		{document.getElementById(id).style.display="Block";}

		else

		{document.getElementById(id).style.display="None";}

	}

}

function over(n){

	for(var i=0;i<4;i++){

	var name="kr"+n;

	if(n==i){

		

	document.getElementById(name).style.color="#ffffff";

	document.getElementById(name).style.backgroundColor="#ad2323";

	}

	else{

		document.getElementById(name).style.color="#000000";

	document.getElementById(name).style.backgroundColor="";

	}

	}

}

</script>

我想让鼠标离开后让离开的那个 DIV保持红色背景

...全文

62 4 打赏收藏举报

写回复

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

草根醉秋意 2010-01-24

打赏
举报

onmouseout呗

kiba518 2010-01-24

打赏
举报

<style>

.kcon{ width:550px; border:1px solid #eeeeee; height:228px;}

.kleft1{ width:405px; height:222px; float:left; padding:3px;}

.kleft2{ width:405px; height:222px; float:left; padding:3px; display:none} 

.kright{   float:right; height:222px; padding:3px; width:127px}

.krnt{margin-top:4px; margin-bottom:5px;}

.krn{margin-bottom:5px;}



.kright a{ display:block;border:1px solid #eeeeee; color:#000000; text-align:center; width:125px; height:49px;line-height:49px; text-decoration:none;}

.kright a.ka:hover{ background-color:#ad2323;color:#FFFFFF;}



</style>

</head>



<body>



<div class="kcon">

<div id="kl0" class="kleft1"><img src="a.jpg"></div>

<div id="kl1" class="kleft2"><img src="b.jpg"></div>

<div id="kl2" class="kleft2"></div>

<div id="kl3" class="kleft2"><img src="d.jpg"></div>



<div class="kright">

	<div id="kr0" class="krnt"  onMouseMove="chang(0)"  onMouseOver="over(0)"><a class="ka" href="#" >第一个</a></div>

	<div id="kr1" class="krn" onMouseMove="chang(1)"  onMouseOver="over(1)"> <a class="ka" href="#" >2</a></div>

	<div id="kr2" class="krn" onMouseMove="chang(2)"  onMouseOver="over(2)"> <a class="ka" href="#" >3</a></div>

	<div id="kr3"             onMouseMove="chang(3)"  onMouseOver="over(3)"> <a class="ka" href="#" >4</a></div>

</div>

</div>

<script language="javascript">

function chang(n)

{

	for(var i=0; i<4;i++)

	{

	var id='kl'+i;

		if(i==n)

		{document.getElementById(id).style.display="Block";}

		else

		{document.getElementById(id).style.display="None";}

	}

}

function over(n){

	for(var i=0;i<4;i++){

	var name="kr"+i;

	if(n==i){

		

	document.getElementById(name).style.color="#FFFFFF";

	document.getElementById(name).style.backgroundColor="#ad2323";

	}

	else{

		document.getElementById(name).style.color="#000000";

	document.getElementById(name).style.backgroundColor="";

	}

	}

}

</script>