jQuery slideToggle() 方法 多个div怎么写

<!DOCTYPEhtml><html><head><scriptsrc="/jquery/jquery-1.11.1.min.js"></script><scriptt... <!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".flip").click(function(){
$(".panel").slideToggle("slow");
});
});
</script>

<style type="text/css">
div.panel,p.flip
{
margin:0px;
padding:5px;
text-align:center;
background:#e5eecc;
border:solid 1px #c3c3c3;
}
div.panel
{
height:120px;
display:none;
}
</style>
</head>

<body>

<div class="panel">
<p>W3School - 领先的 Web 技术教程站点</p>
<p>在 W3School,你可以找到你所需要的所有网站建设教程。</p>
</div>

<p class="flip">请点击这里</p>

</body>
</html>
展开
 我来答
yugi111
2015-09-26 · TA获得超过8.1万个赞
知道大有可为答主
回答量:5.1万
采纳率:70%
帮助的人:1.3亿
展开全部
<!DOCTYPE html>
<html>

<head>
    <script src="/jquery/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $(".flip").click(function() {
                $(".panel:eq(" + $(this).index(".flip") + ")").slideToggle("slow");
            });
        });
    </script>
    <style type="text/css">
        div.panel,p.flip {
    margin: 0px;
    padding: 5px;
    text-align: center;
    background: #e5eecc;
    border: solid 1px #c3c3c3;
}

div.panel {
    height: 120px;
    display: none;
}
    </style>
</head>

<body>
    <div class="panel">
        <p>W3School - 领先的 Web 技术教程站点</p>
        <p>在 W3School,你可以找到你所需要的所有网站建设教程。</p>
    </div>
    <p class="flip">请点击这里</p>
    <div class="panel">
        <p>W3School - 领先的 Web 技术教程站点</p>
        <p>在 W3School,你可以找到你所需要的所有网站建设教程。</p>
    </div>
    <p class="flip">请点击这里</p>
</body>

</html>
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式