js鼠标单击上面任意一个DIV 下面显示该DIV的内容的DIV,其它三个DIV内容的DIV就隐藏
1个回答
展开全部
提供一段代码你参考一下:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>测试代码</title>
<link href="http://www.e-zhao.net/templets/greed/css/ezhao.css" rel="stylesheet" media="screen" type="text/css" />
<style>
body {background:none;}
</style>
<script type="text/javascript">
function secList(n)
{
for(var i=1;i<5;i++)
{
document.getElementById("Selt_"+i).style.height="48px";
document.getElementById("Selt_"+i).style.border="1px solid #ccc";
document.getElementById("Selt_"+i).style.borderBottom="none";
document.getElementById("Selt_"+i).style.fontWeight="400";
document.getElementById("Selt_"+i).style.background="#fff";
document.getElementById("example_conList_"+i).style.display="none";
}
document.getElementById("Selt_"+n).style.height="50px";
document.getElementById("Selt_"+n).style.border="2px solid #dfdfdf";
document.getElementById("Selt_"+n).style.borderBottom="none";
document.getElementById("Selt_"+n).style.fontWeight="600";
document.getElementById("Selt_"+n).style.backgroundColor="#f4f4f4";
document.getElementById("example_conList_"+n).style.display="block";
}
</script>
</head>
<body>
<div class="index_example">
<div class="example_title">
<a class="more" href="#">更多案例></a><strong>实效实例展示</strong>
<p>细节决定成败,用心比什么都重要,每一个营销案例,都是我们向前成长的见证。</p>
</div>
<div class="example_con">
<div class="example_titleList">
<ul>
<li class="on" id="Selt_1" onmouseover="secList(1)">营销型网站建设</li>
<li class="out" id="Selt_2" onmouseover="secList(2)">SEO优化</li>
<li class="out" id="Selt_3" onmouseover="secList(3)">网站推广</li>
<li class="out" id="Selt_4" onmouseover="secList(4)">网络营销</li>
</ul>
</div>
<div class="block" id="example_conList_1">
<ul>
<li>
<img width="237" src="http://www.e-zhao.net/uploads/150523/1.jpg" />
<a class="example_conT" href="http://www.e-zhao.net/marketing/13.html">深圳市百音汇科技</a>
<p>深圳市百音汇科技有限公司是一家致力于工业安全、机床安全、传感与控制技术的生产与销售为一体的厂家...<span><a href="http://www.e-zhao.net/marketing/13.html">[详细]</a></span></p>
</li>
<li>
<img width="237" src="http://www.e-zhao.net/uploads/index-14.jpg" />
<a class="example_conT" href="#">罗西尼手表</a>
<p>珠海罗西尼表业有限公司创立于1984年7月,是国内钟表行业成立最早的一家企业。公司...<span><a href="#">[详细]</a></span></p>
</li>
<li style="margin-right:0px;">
<img width="237" src="http://www.e-zhao.net/uploads/index-14.jpg" />
<a class="example_conT" href="#">罗西尼手表</a>
<p>珠海罗西尼表业有限公司创立于1984年7月,是国内钟表行业成立最早的一家企业。公司...<span><a href="#">[详细]</a></span></p>
</li>
</ul>
</div>
<div class="unblock" id="example_conList_2">
<ul>
<li>
<img width="237" src="http://www.e-zhao.net/uploads/150523/1-150523132G5347.jpg" />
<a class="example_conT" href="http://www.e-zhao.net/seo_case/12.html">深圳市富盈星电子</a>
<p>深圳市富盈星电子有限公司是一家专业从事高端无线电子门铃的生产型企业,公司专业专注生产高端无线数字门铃...<span><a href="http://www.e-zhao.net/seo_case/12.html">[详细]</a></span></p>
</li>
<li>
<img width="237" src="http://www.e-zhao.net/uploads/index-7.jpg" />
<a class="example_conT" href="#">罗西尼手表</a>
<p>珠海罗西尼表业有限公司创立于1984年7月,是国内钟表行业成立最早的一家企业。公司...<span><a href="#">[详细]</a></span></p>
</li>
<li style="margin-right:0px;">
<img width="237" src="http://www.e-zhao.net/uploads/index-14.jpg" />
<a class="example_conT" href="#">罗西尼手表</a>
<p>珠海罗西尼表业有限公司创立于1984年7月,是国内钟表行业成立最早的一家企业。公司...<span><a href="#">[详细]</a></span></p>
</li>
</ul>
</div>
<div class="unblock" id="example_conList_3">
<ul>
<li>
<img width="237" src="http://www.e-zhao.net/uploads/index-7.jpg" />
<a class="example_conT" href="#">罗西尼手表</a>
<p>珠海罗西尼表业有限公司创立于1984年7月,是国内钟表行业成立最早的一家企业。公司...<span><a href="#">[详细]</a></span></p>
</li>
<li>
<img width="237" src="http://www.e-zhao.net/uploads/index-7.jpg" />
<a class="example_conT" href="#">罗西尼手表</a>
<p>珠海罗西尼表业有限公司创立于1984年7月,是国内钟表行业成立最早的一家企业。公司...<span><a href="#">[详细]</a></span></p>
</li>
<li style="margin-right:0px;">
<img width="237" src="http://www.e-zhao.net/uploads/index-14.jpg" />
<a class="example_conT" href="#">罗西尼手表</a>
<p>珠海罗西尼表业有限公司创立于1984年7月,是国内钟表行业成立最早的一家企业。公司...<span><a href="#">[详细]</a></span></p>
</li>
</ul>
</div>
<div class="unblock" id="example_conList_4">
<ul>
<li>
<img width="237" src="http://www.e-zhao.net/uploads/index-7.jpg" />
<a class="example_conT" href="#">罗西尼手表</a>
<p>珠海罗西尼表业有限公司创立于1984年7月,是国内钟表行业成立最早的一家企业。公司...<span><a href="#">[详细]</a></span></p>
</li>
<li>
<img width="237" src="http://www.e-zhao.net/uploads/index-7.jpg" />
<a class="example_conT" href="#">罗西尼手表</a>
<p>珠海罗西尼表业有限公司创立于1984年7月,是国内钟表行业成立最早的一家企业。公司...<span><a href="#">[详细]</a></span></p>
</li>
<li style="margin-right:0px;">
<img width="237" src="http://www.e-zhao.net/uploads/index-14.jpg" />
<a class="example_conT" href="#">罗西尼手表</a>
<p>珠海罗西尼表业有限公司创立于1984年7月,是国内钟表行业成立最早的一家企业。公司...<span><a href="#">[详细]</a></span></p>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询