<!DOCTYPE html>

  <html>

  <head>

      <title>tab</title>

      <style type="text/css">

           #tabs{

           	   width:500px;

           	   height:500px;

           	   margin:0 auto;

           }

           .ui-widget-header{

           	  border:1px solid grey;

              background:grey;

              color:#fff;

              font-weight:bold;

           }

      </style>

      <link  rel="stylesheet" href="css/jquery-ui-1.10.4.min.css"  media="screen"/>

      <script type="text/javascript" src="js/jquery-1.10.2.js"></script>

      <script type="text/javascript" src="js/jquery-ui-1.10.4.min.js"></script>

  </head>

  <body>

     <div id="tabs">

        <ul>

            <li><a href="#tabs-1">first tab</a></li>

            <li><a href="#tabs-2">second tab</a></li>

        </ul>

        <div id="tabs-1">

           <p>this is the first tab</p>

        </div>

        <div id="tabs-2">

           <p>this is the second tab</p>

        </div>

     </div>

     <script>

         $(function(){

         	$("#tabs").tabs();

         });

     </script>

  </body>

  </html>

　　

jquery ui tab标签的更多相关文章

  1. jquery切换tab标签例子

    之前做了一个简单的小效果,使用jquery方式,让tab标签切换,效果如下 代码其实很简单,首先先把代码分享给大家,代码如下 var shoptoggle = $('.shoptoggle .shop ...

  2. jQuery实现tab标签切换效果

    技巧一.jQuery :eq() 选择器 定义和用法 :eq() 选择器选取带有指定 index 值的元素. index 值从 0 开始,所有第一个元素的 index 值是 0(不是 1). 经常与其 ...

  3. [转]Hide or Remove jquery ui tab based on condition

    本文转自:http://stackoverflow.com/questions/19132970/hide-or-remove-jquery-ui-tab-based-on-condition 问: ...

  4. jquery ui tab跳转

    1.tabs_iframe.jsp <%-- Document : tabs Created on : 2015-2-28, 14:44:02 Author : liyulin lyl01099 ...

  5. jquery ui 怎么实现tab标签切换效果

    1.效果图 2.HTML 代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> &l ...

  6. jquery插件之tab标签页或滑动门

    该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的tab标签页或滑动门特效,在此插件中默认使用的是鼠标滑过 ...

  7. 如何一行jquery代码写出tab标签页（链式操作）

    啦啦!今天又学了一招,js写几十行的tab标签页jquery写一行就行啦,用到了链式操作!以下是代码: <!DOCTYPE html> <html lang="en&quo ...

  8. jquery实现同时展示多个tab标签+左右箭头实现来回滚动（美化版增加删除按钮）

    闲聊 前段时间小颖分享了:jquery实现同时展示多个tab标签+左右箭头实现来回滚动文章,引入项目后,我们的组长说样子太丑了,小颖觉得还好啊,要不大家评评理,看下丑不丑?无图无真相,来上图: 看吧其 ...

  9. jquery实现同时展示多个tab标签+左右箭头实现来回滚动

    内容: jquery实现同时展示多张图片+定时向左单张滚动+前后箭头插件 jquery实现同时展示多个tab标签+左右箭头实现来回滚动 小颖最近的项目要实现类似如下效果: 蓝色框圈起来的分别是向上翻. ...

随机推荐

  1. linux shell中，单引号、 双引号，反引号（``），$()的区别

    一.单引号和双引号 首先,单引号和双引号,都是为了解决中间有空格的问题. 空格在linux中时作为一个很典型的分隔符,比如 string1=this is a string,这样执行会报错.为了避免这 ...

  2. BZOJ3996 [TJOI2015]线性代数

    就是求$D = A \times B \times A^T - C \times A^T$ 展开也就是$$D = \sum_{i, j} A_i * A_j * B_{i, j} - \sum_{i} ...

  3. PDF 补丁丁 0.4.1 版：新增嵌入中文字库、替换文档字库的功能

    PDF 补丁丁 0.4.1 版新增了嵌入中文字库.替换文档字库的功能. 嵌入汉字字库 历史上有一批黄底黑字的 PDF 文档.这批文档都具有相同的问题:没有嵌入字库.在一些设备上阅读时显示乱码.复制文本 ...

  4. jQuery实现图片延迟加载

    html: <img src ="占位图路径" data-original="真实图片路径" /> js: $("img").l ...

  5. 12个强大的Chrome插件

    Chrome功能强大,也得益于其拥有丰富的扩展资源库.Chrome Web Store里有各种各样的插件,可以满足你使用Chrome时的各种要求.和Firefox一样,Chrome的扩展非常容易安装, ...

  6. flash as3 socket安全服务网关（socket policy file server）

    关键字: SecurityErrorEvent socket as3 flash有着自己的一套安全处理模式,在socket方面,我这样的菜鸟无法理解他的好处:一句话,不怀好意的人如果想用flash写一 ...

  7. 利用smarty call函数实现无限极分类

    定义一个function {function name=menu level=0} <ul class="level{$level}"> {foreach $data ...

  8. 【C++】String类实现

    //string.h #include <iostream> using namespace std; class String; istream& operator>> ...

  9. bzoj 2440 简单莫比乌斯反演

    题目大意: 找第k个非平方数,平方数定义为一个数存在一个因子可以用某个数的平方来表示 这里首先需要考虑到二分才可以接下来做 二分去查找[1 , x]区间内非平方数的个数,后面就是简单的莫比乌斯反演了 ...

  10. POJ 2104 静态找区间第k大

    静态区间第k大的问题,往往可以利用主席树来解决 这是主席树的第一道题 主席树大概可以理解为在n个节点上都建立一棵线段树,但是想想会超出内存 每一个节点保存的线段树都记录当前整段前缀区间的信息 但是因为 ...