鼠标移动到指定位置显示网页内容,鼠标移出隐藏
仿百度百科
演示地址:http://www.corange.cn/demo/3724/index.html
<!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=utf-8" />
<title>仿百度百科展开隐藏列表功能</title>
<link href="css/css.css" rel="stylesheet" type="text/css"/>
<script src="js/tangram-1.1.0.js" type="text/javascript"></script>
<script src="js/base.js" type="text/javascript"></script>
</head>
<body>
<div id="wrap">
<fieldset class="text_dir" id="catalog">
<p>麦田圈 www.corange.cn<span>[<a href="javascript:void(0)" id="dir_alt" onClick="lemma.catalog.showCatalog();">隐藏</a>]</span></p>
<dl id="holder1">
<dd><a href="#">麦田圈简介</a></dd>
<dd><a href="#">形成原因</a><ol><li><a href="http://www.sharejs.com">一是磁场说。</a></li><li><a href="#">二是龙卷风说。</a></li><li><a href="#">三是外星制造说。</a></li><li><a href="#">四是异端说。 </a></li><li><a href="#">五是流传较为广泛的说法是人造说。</a></li></ol></dd>
<dd><a href="#">麦田圈的资料及历史</a>
<ol><li><a href="#">水母形状的“麦田怪圈”</a></li><li><a href="#">麦田圈之谜破解</a></li><li><a href="#">麦田怪圈是种行为艺术?</a></li><li><a href="#">麦田怪圈成因又有新说法</a></li><li><a href="#">麦田怪圈惊现英国</a></li><li><a href="http://www.sharejs.com">神秘标志</a></li></ol>
</dd>
<dd><a href="#">麦田圈的特征</a>
<ol><li><a href="http://www.sharejs.com">人工制造麦田怪圈赏</a></li><li><a href="#">非人造麦田圈的十大特征</a></li><li><a href="#">白鸦行动</a></li><li><a href="#">麦田怪圈的猜想</a></li><li><a href="#">神秘的麦田怪圈</a></li><li><a href="#">破解麦田圈之谜破解</a></li><li><a href="#">英国出现凤凰涅磐状麦田怪圈</a></li><li><a href="#">麦田圈究竟来自何方?</a> </li></ol>
</dd>
</dl>
<dl id="holder2"></dl>
</fieldset>
<script type="text/javascript">lemma.catalog.start();</script>
</div>
</body>
</html>
完整地址到演示地址看