关闭

jquery实现单机表题则显示链接内容

标签: jqueryjavascriptborderfunctionxhtmlprototype
451人阅读 评论(0) 收藏 举报
//网页中难免会遇到有很长一段内容,这时我们可以将其隐藏当点击时在显示出来
<!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>
<style type="text/css">
.content{
	
	display:none;
	}

</style>
<script type="text/javascript" language="javascript" src="../jquery-1.7.1.min.js">
</script>

<script type="text/javascript" language="javascript">
$(document).ready(function(){
	   $("h5").live("click",function(){
		if($(this).next("div.content").is(":visible")){
			
			$(this).next("div.content").hide();
			}else{
				$(this).next("div.content").show();
				}
		});
	
	});

</script>
</head>

<body>
<div id="panel">
<h5 class="header" style="width:160px; height:20px; background:#9C0; border:1px #03C solid">什么事jquery?</h5>
<div class="content" style="width:160px; height:60px; border:1px #CCC solid; background:#CCC; margin-top:-19px">
jQuery是继Prototype之后又一个优秀的javascript的库
</div>
</div>
</body>
</html>



   
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:164411次
    • 积分:2742
    • 等级:
    • 排名:第13113名
    • 原创:115篇
    • 转载:19篇
    • 译文:0篇
    • 评论:97条
    文章分类
    最新评论