首页 » 建站技术 » 浏览内容

Jquery实现DIV伸缩特效


2012-06-07 00:56:43 4,014 0 发表评论 字体: 作者:C.K.
标签: DIVJquery

体验版 88 元,个人版 128 元,多用户版 288元个人版160元升级到多用户版。

首页在head区域加入JS代码

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  • <script type="text/javascript">
  • $(function() {
  • $(".b2").click(function() {
  • $("#content").slideToggle("fast");
  • $('.b2').css("display","none");
  • $('.b1').css("display","block");
  • });
  • $(".b1").click(function() {
  • $("#content").slideToggle("fast");
  • $('.b1').css("display","none");
  • $('.b2').css("display","block");
  • });
  • });
  • </script>
  • 再到body里加入

    <div class="title"><a href="javascript:;" class="b2" style="display: block; ">这是是标题</a> <a href="javascript:;" class="b1" style="display: none; ">这是是标题</a></div>
  • <div id="content">这里是内容</div>
  • 如果要好看的话自己就定义下相应的CSS样式吧

    网站统计 Statistics

    • 创建时间: 2005年1月3日 距今5064 天
    • 日志总数: 2461
    • 评论总数: 630
    • 标签总数: 654
    • 链接总数: 273
    • 最后更新: 2018-8-31 17:57:04
    • 您是本站第 14159097 位访客

    广告区 Guǎng Gào