首页 手机软件 手机游戏 单机游戏 资讯文章 专题下载 游戏合集 文章合集 php下载 php教程 电脑软件
+ -
当前位置：首页 → 问答吧 → 这个JQUERY选项卡怎么一点效果也没有呢

这个JQUERY选项卡怎么一点效果也没有呢

时间：2009-06-15

来源：互联网

复制代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh" dir="ltr">
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.     <meta name="generator" content="" />
  6.     <meta name="keywords" content="" />
  7.     <meta name="description" content="" />
  8.     <meta name="author" content="" />
  9.     <script type="text/javascript" src="jquery.js"></script>
  10.     <title>Example | xHTML1.0</title>
  11.         <title>tes</title>
  12.         <style type="text/css">
  13.             #tab ul {width: 100%;height: 20px;}
  14.             #tab li{list-style-type: none; display: inline}
  15.         </style>
  16.             <script>
  17.     $(document).ready(function(){
  18.         //$("#tab").find("div").hide();
  19.         $("#tab>div:not(:first)").hide();
  20.         $("ul>li>a").click(function(){
  21.             $("div").slideDown("fast");//
  22.         },function(){
  23.             $("div").hide();
  24.         });
  25.     });
  26.     </script>
  27. </head>
  28. <body>
  29.         <div id="tab">
  30.             <ul>
  31.                 <li><a href="#tab-1">第一个</a></li>
  32.                 <li><a href="#tab-2">第二个</a></li>
  33.             </ul>
  34.             <div id="tab-1">
  35.                 <h2>第一个TABS内容</h2><li><a>第一个TABS内容</a></li>
  36.                 <p>第一个第一个TABS内容</p>
  37.             </div>
  38.             <div id="tab-2">
  39.                 <h2>第二个第一个TABS内容</h2>
  40.                 <p>第二个第一个TABS内容</p><p>第二个第一个TABS内容</p>
  41.             </div>
  42.             
  43.         </div>
  44. </body>
  45. </html>



不管点第一个还是第二个多会出现  tab-2的内容而且tab-1 也不隐藏 ，新手学习 请大虾多多指点

作者: strongability   发布时间: 2009-06-15

$("div").slideDown("fast");

这个是对所有的div进行操作，你没指定tab-1还是tab-2

可以获取a的href属性，去掉#，然后对它使用id选择器




此外，jQuery UI有个tab插件

作者: keakon   发布时间: 2009-06-16

jQuery UI那个tab插件 一开始TABS会拉的很长 然后再恢复正常
http://www.lysj.net就是用的那个  我感觉太大了点资源消耗太多的问题吧?

作者: strongability   发布时间: 2009-06-16

相关阅读 更多

热门阅读

热门下载

更多
关于本站 免责申明 联系我们

Copyright 2006-2020 php爱好者(phpfans.net) All Rights Reserved.备案号：湘ICP备2023016114号-2

本站为非盈利性网站，不接受任何广告。本站所有资源均由网友上传，如有侵权，请发邮件至 [email protected] phpfans.net