jQuery 手风琴 

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
	* { margin:0; padding:0; }
	dl { width:300px; margin:50px auto; overflow:hidden; border:1px solid #ccc; }
	dt { height:30px; line-height:30px; border-top:1px solid #ccc; border-bottom:1px solid #ccc; }
</style>
</head>
<body>





	<dl>
		<dt>jQuery简介:</dt>
		<dd>jQuery由美国人John Resig创建。jQuery是继prototype之后又一个优秀的Javascrīpt框架。</dd>
		<dt>jQuery必备下载:</dt>
		<dd>jQuery由美国人John Resig创建。jQuery是继prototype之后又一个优秀的Javascrīpt框架。</dd>
		<dt>Query入门教程:</dt>
		<dd>jQuery由美国人John Resig创建。jQuery是继prototype之后又一个优秀的Javascrīpt框架。</dd>
	</dl>








<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
	$(function()
	{
		$("dd").hide();
		$("dd:first").show();
		$("dt").mouseover(function()
		{
				if($(this).next().is(":hidden"))
				{
					$("dd").hide();
					$(this).next().show();   
				}
		});
	});
</script>

</body>
</html>

　　

posted @ 2012-03-31 22:37  赵小磊  阅读(541)  评论(0)    收藏  举报
回到头部