实用的文章列表内容鼠标感应切换显示特效，鼠标滑过标题时自动展开列表内容显示效果，根据自己的需求来自定义即可。
<html>
<head>
<meta http-equiv="content-Type" content="text/html;charset=gb2312">
<meta name="keywords" content="武鸣人网站,武鸣信息网,武鸣本地网,武鸣信息资源平台,减肥,健身,励志,励志语录,js特效,网页特效,www.wuming.ren">
<meta name="description" content="欢迎来到武鸣人信息资源平台，各种信息免费发布，资源共享合作共赢，分享互联网流行的励志语录经典短句，减肥健身健康小常识及打卡记录，收集各种js特效代码。">
<title>js+css实现文章列表鼠标感应切换显示效果_武鸣人</title>
<style type="text/css">
#www_wuming_ren{overflow:hidden;width:175px;height:100%;overflow:hidden}
#www_wuming_ren ul{margin:0;padding:0}
#www_wuming_ren li{list-style-type:none;display:block;width:175px}
#www_wuming_ren li a{display:block;text-decoration:none;width:100%;line-height:20px}
#www_wuming_ren li a span{display:none;color:#999;font-size:12px;border-bottom:1px dashed #CCC;width:175px;margin:0;padding:0}
#www_wuming_ren li a:hover{background:#FFF}
#www_wuming_ren li:hover span, #www_wuming_ren li a:hover span{display:block;cursor:pointer}
#www_wuming_ren h1{margin:0;color:#F60;font-size:12px;padding:0}
#www_wuming_ren li span img{float:left;margin:3px 5px 0 0;border:1px solid #CCC}
</style>
</head>
<body>
<a href="https://www.wuming.ren">武鸣人</a>，各种信息资源免费发布，分享励志语录经典短句，减肥健身常识，各种js特效代码。网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)<hr>
<!--欢迎来到武鸣人信息资源平台，各种信息免费发布，资源共享合作共赢，分享互联网流行的励志语录经典短句，减肥健身健康小常识及打卡记录，收集各种js特效代码。-->
<script type="text/javascript" src="https://www.wuming.ren/ad/tc.js"></script>
<script type="text/javascript" src="https://www.wuming.ren/ad/a.js"></script>
<ul id="www_wuming_ren">
<li><a href="https://www.wuming.ren" target="_blank"><h1>壮哉！300亿堆砌圣人庙</h1><span>在民生多艰之极，中华文化标志城该不该建，它能不能代表中华文化，如此耗资巨大国家工程应不应公开讨论？各界评论如潮。</span></a></li>
<li><a href="https://www.wuming.ren" target="_blank"><h1>俄总统总理或演权力大战</h1><span>总统大选前，普京让西方迷惑：谁是接班人？大选之后，普京再让西方不解：他到底有没接班人？</span></a></li>
<li><a href="https://www.wuming.ren" target="_blank"><h1>房地产再成两会关注焦点</h1><span>两会上，房地产再次成为政府关注的一个焦点！房价走势如何，且听委员们慢慢道来！</span></a></li>
<li><a href="https://www.wuming.ren" target="_blank"><h1>武鸣人www.wuming.ren</h1><span>收集各种网页特效！</span></a></li>
</ul>
<script type="text/javascript">
<!--
window.onload=function(){var s=document.getElementById('www_wuming_ren').getElementsByTagName('span');s[0].style.display='block';for(var a=0;a<s.length;a++){s[a].parentNode.onmousemove=function(){for(var b=0;b<s.length;b++){if(s[b].parentNode != this) s[b].style.display='none';else s[b].style.display='block';}};}};
-->
</script>
</body>
</html>本文来自武鸣人网站，转载请注明出处