jQuery折叠层，默认闭合，点击紧缩和睁开结果

发布时间：2018-08-13 10:07:36 所属栏目：活动来源：站长网

导读：方才先容了一款操作 jQuery 实现的折叠层，点击紧缩和睁开结果，默认环境下是睁开的，也许有的童鞋必要默认环境是闭合的，此刻就来分享一下，这里首要是用 Java Script代码界说的，在此提醒，第一次运行请革新一下页面，让长途的jQuery插件载入。为办理一

　　方才先容了一款操作jQuery实现的折叠层，点击紧缩和睁开结果，默认环境下是睁开的，也许有的童鞋必要默认环境是闭合的，此刻就来分享一下，这里首要是用JavaScript代码界说的，在此提醒，第一次运行请革新一下页面，让长途的jQuery插件载入。

　　为办理一些网页殊效运行后不能表现结果(譬喻：jQuery则必要革新)题目，猛火出格新增网页版演示。

　　点击查察：网页殊效

　　运行演示：

<!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=gbk" /> <title>jquery 紧缩睁开结果</title> <script type="text/javascript" src="/uploads/common/js/jquery-1.4.2.min.js"></script> <style> /* 紧缩睁开结果 */ .text{line-height:22px;padding:0 6px;color:#666;} .box h1{padding-left:10px;height:22px;line-height:22px;background:#f1f1f1;font-weight:bold;} .box{position:relative;border:1px solid #e7e7e7;} h1{font-size:16px;} </style> </head> <body> <script type="text/javascript"> // 紧缩睁开结果 $(document).ready(function(){ // $(".box h1").toggle(function(){ // $(this).next(".text").animate({height: 'toggle', opacity: 'toggle'}, "slow"); // },function(){ //$(this).next(".text").animate({height: 'toggle', opacity: 'toggle'}, "slow"); / <p style="text-align:right;">（编辑：湖南网）</p> <p style="text-align:right;">【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!</p> </td> </tr> </table> </div> <div class="dede_pagess"><ul class="pagelist"></ul></div> <div class="ad-690"><script src='https://ess.0577qiche.com/d/js/acmsd/ad76.js' language='javascript'></script></div> <div class="g-box10"> <div class="t-2">相关内容</div> <ul class="b-box12"></ul> <ul class="b-box13"><li><a href="https://www.hunanwang.cn/html/huodong/20201003/633380.html" target="_blank">2020阿里巴巴云栖大会来了！看看有哪些技术创新！</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20201129/651624.html" target="_blank">sql server数据库中raiserror函数用法的详细介绍</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20190724/445323.html" target="_blank">抢占“五环外”赛道，趣头条成为新兴市场最高级量进口</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20201003/633382.html" target="_blank">百分点公司“智慧应急大脑”在国际应急产业博览会上重磅发布</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20170716/328790.html" target="_blank">让你的网络为火热的世界杯来袭做好准备</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20201130/651943.html" target="_blank">ajax post下载flask文件流以及中文文件名问题</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20201024/639156.html" target="_blank">SEO网站优化的目标：是关键词排名吗</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20191212/488599.html" target="_blank">解码“常”“变”之谜,探寻长青之道</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20170624/327513.html" target="_blank">华三中标江苏公安厅视频和数据中心项目</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20190724/445583.html" target="_blank">包围办公需叱责场景，打造商用采购全流程处事</a></li><div class="cl"></div></ul> </div> </div> </div> <div class="right-1 fr"> <div class="g-box8"> <div class="t-2">推荐文章</div> <ul></ul> </div> <div class="g-box11"> <div class="t-2">站长推荐</div> <ul class="b-box7"><li><a href="https://www.hunanwang.cn/html/huodong/20191127/477893.html" target="_blank">精彩预告|2018中国医药CIO峰会10月即将上演！80+</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20180816/368637.html" target="_blank">jQuery实现鼠标滑过打开层，笔墨睁开结果</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20180817/369178.html" target="_blank">点击弹出遮罩层，JavaScript弹出可封锁的对话框</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20201115/646873.html" target="_blank">高级指令site:、domain:、inurl:如何使用都有什</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20190722/444545.html" target="_blank">在网站方才被收录的时辰，是否必要插手一些外部链</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20200429/574694.html" target="_blank">第二届数字化转型企业处事商大会乐成举行</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20201104/642979.html" target="_blank">伪原创文章凉了吗是否还有价值</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20200724/618690.html" target="_blank">8.28第六届环球创颐魅者大会暨直播社群资源对接大</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20200724/618794.html" target="_blank">软文推广难做吗？骨灰级软文推广秘笈请查收</a></li><li><a href="https://www.hunanwang.cn/html/huodong/20201103/642268.html" target="_blank">百度SEO排名道理</a></li></ul> </div> <script type="text/javascript">jQuery(".g-box8").slide({ titCell:"li",triggerTime:0 }); </script> <div class="ad-250"><script src='https://ess.0577qiche.com/d/js/acmsd/ad103.js' language='javascript'></script></div> <div class="g-box3 u-3"> <div class="t-1">热点阅读</div> <ul class="b-box2"></ul> </div> <div class="ad-250"><script src='https://ess.0577qiche.com/d/js/acmsd/ad77.js' language='javascript'></script></div> </div> <div class="cl"></div> </div> <div class="ad-960"><script src='https://ess.0577qiche.com/d/js/acmsd/ad78.js' language='javascript'></script></div> <div class="footer"> <p>【免责声明】本站内容转载自互联网，其发布内容言论不代表本站观点，如果其链接、内容的侵犯您的权益，烦请提交相关链接至邮箱bqsm@foxmail.com我们将及时予以处理。</p> <p>建议您使用1920×1080分辨率、谷歌浏览器Google Chrome、Microsoft Edge以获得本站的最佳浏览效果</p> <p>Copygight © 2008-2022 https://www.hunanwang.cn/ All Rights Reserved. 湖南网</p> <p><script type="text/javascript" src="//js.users.51.la/21280179.js"></script></p> </div> </body> </html>