效果图：
js代码 ：
<SCRIPT>
function doClick(o){
o.style.backgroundImage='url(images/over.jpg)'
o.innerHTML="<span style='color:#F08200;'>" + o.innerHTML +"</span>";
}
function doOut(o){
o.style.backgroundImage=''
}
</SCRIPT>
<div class="promenun">
<ul>
<li>现代风格</li>
<li style="MARGIN-LEFT: 2px"><div onmouseover="javascript:doClick(this)" onmouseout="javascript:doOut(this)">现代风格</div></li>
<li style="MARGIN-LEFT: 2px"><div onmouseover="javascript:doClick(this)" onmouseout="javascript:doOut(this)">现代风格</div></li>
</ul>
</div>
注：
<SCRIPT>
function doClick(o){
o.style.backgroundImage='url(images/over.jpg)'
o.style.color='#f08200'
}
function doOut(o){
o.style.backgroundImage=''
o.style.color='#949694'
}
</SCRIPT>
注2：
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="hdyg.ascx.cs" Inherits="webcontrollers_hdyg" %>
<div ;
}
}
}
</SCRIPT>
分析：为什么不用 visibility控制？
当用visibility控制时，div所占区域是不会改变的，会留下空白！
参考：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head ;
}
}
}
function doClickf(o,n){
o.className="overf"
var id = o.id+"";
var dd=id.substring(2,1);
document.getElementById("ef"+dd).style.display="block"
var j;
var id;
var e;
for(var i=1;i<=n;i++){
id ="f"+i;
j = document.getElementById(id);
e = document.getElementById("ef"+i);
if(id != o.id){
j.className="outf";
e.style.display = "none";
}
}
}
function doClickk(o,n){
o.className="overk"
var id = o.id+"";
var dd=id.substring(2,1);
document.getElementById("ek"+dd).style.display="block"
var j;
var id;
var e;
for(var i=1;i<=n;i++){
id ="k"+i;
j = document.getElementById(id);
e = document.getElementById("ek"+i);
if(id != o.id){
j.className="outk";
e.style.display = "none";
}
}
}
</SCRIPT>
</head>
<body>
<form /> 阳光美景城</div></li>
</ul>
</div>
</div>
<div style="margin-top:15px;">
<div class="promenun">
<ul>
<li><div /> 阳光美景城</div></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div style="text-align:center; margin-top:30px;">
<img src="images/bottom.jpg" width="1006" height="79" />
</div>
</form>
</body>
</html>