当鼠标点击一个超链接时显示隐藏的内容
例如这个现在在css里已经隐藏了部分内容了要求就是鼠标点击显示以及隐藏<html><head><title>NewDocument</title><metaname="G...
例如这个 现在在css里已经隐藏了部分内容了 要求就是鼠标点击显示以及隐藏
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script type="text/javascript" >
</script>
</head>
<style type="text/css">
.bord{
border:1px solid red;
height:300px;
width:1000px
}
.zj{
border:1px solid blue;
width:300px;
height:296px;
float:left;
}
.zb{
border:1px solid black;
width:694px;
height:296px;
float:right;
}
.bord .zb .tangshi1 p{
border:1px solid red;
width:300px;
height:249px;
display:block;
}
.bord .zb .tangshi2 p{
border:1px solid blue;
width:300px;
height:249px;
display:none;
}
.bord .zb .tangshi3 p{
border:1px solid yellow;
width:300px;
height:249px;
display:none;
}
</style>
<body>
<div class="bord" >
<div class="zj">
<ul id="curu">
<li id="jingyesi"><a href="#">《静夜思》</a></li>
<li><a href="#">《悯农》</a></li>
<li><a href="#">《春晓》</a></li>
</ul>
</div>
<div class="zb">
<div class="tangshi1"><p>11111111111</p></div>
<div class="tangshi2"><p>22222222222</p></div>
<div class="tangshi3"><p>777777</p></div>
</div>
</div>
</body>
</html>
</body>
</html>
这是简单样式 希望大侠能给写出代码 给肉 展开
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script type="text/javascript" >
</script>
</head>
<style type="text/css">
.bord{
border:1px solid red;
height:300px;
width:1000px
}
.zj{
border:1px solid blue;
width:300px;
height:296px;
float:left;
}
.zb{
border:1px solid black;
width:694px;
height:296px;
float:right;
}
.bord .zb .tangshi1 p{
border:1px solid red;
width:300px;
height:249px;
display:block;
}
.bord .zb .tangshi2 p{
border:1px solid blue;
width:300px;
height:249px;
display:none;
}
.bord .zb .tangshi3 p{
border:1px solid yellow;
width:300px;
height:249px;
display:none;
}
</style>
<body>
<div class="bord" >
<div class="zj">
<ul id="curu">
<li id="jingyesi"><a href="#">《静夜思》</a></li>
<li><a href="#">《悯农》</a></li>
<li><a href="#">《春晓》</a></li>
</ul>
</div>
<div class="zb">
<div class="tangshi1"><p>11111111111</p></div>
<div class="tangshi2"><p>22222222222</p></div>
<div class="tangshi3"><p>777777</p></div>
</div>
</div>
</body>
</html>
</body>
</html>
这是简单样式 希望大侠能给写出代码 给肉 展开
1个回答
展开全部
用jquery实现超简单的
$('#searchSwitch').toggle(
function () {
$('#searchPanel').slideUp();
$(this).val('展开搜索');
},
function () {
$('#searchPanel').slideDown();
$(this).val('收起搜索正芦');
}
);
<input type="button" style="margin-left:5px;"
class="buttonBg1" value="收起搜索举咐带" id="searchSwitch">
上回答中简裤的searchPanel' 指的是所要隐藏的div块
$('#searchSwitch').toggle(
function () {
$('#searchPanel').slideUp();
$(this).val('展开搜索');
},
function () {
$('#searchPanel').slideDown();
$(this).val('收起搜索正芦');
}
);
<input type="button" style="margin-left:5px;"
class="buttonBg1" value="收起搜索举咐带" id="searchSwitch">
上回答中简裤的searchPanel' 指的是所要隐藏的div块
追问
我说的不是一个按钮 如果是按钮就好写了 他是一个超链接 当你点击那个唐诗题目的时候 显示对应的诗句 点击别的 隐藏刚刚显示的诗句
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
|
广告 您可能关注的内容 |
