jquery-tabs面板

原创 2012年03月28日 17:34:08

<!--引入jquery类库文件-->

<scriptsrc="js/jquery-1.7.1.min.js"></script>

<scriptsrc="js/jquery-ui-1.8.18.custom.min.js"></script>

<!--引入css样式类库-->

<link rel="stylesheet"type="text/css" href="css/jquery-ui-1.8.18.custom.css"/> /*juqery代码部分*/

<script>

//当窗体加载完毕的时候触发该匿名函数

$(function(){

$('#tabs').tabs({  //根据id选择器获取当前的id选择器的jquery对象

    event:'click',   //面板是展开的事件效果,默认是click效果

    fx:{

          opacity:'toggle'//透明度  从无到有的一个动画效果

        }

      selectd:1    //默认选中模板

  });

 $('#tabs').tabs('remove',2);//移除面板  

  //$('#tabs').tabs('add','tab-4.html','four');//添加一个面板

});

</script>

 

/*html代码部分*/

<h1>模拟tabs效果</h1>

  <div id='tabs'>

     <ul>

        <li><a href='#tab-1'>面板1</a></li>

        <li><a href='#tab-2'>面板2</a></li>

        <li><a href='#tab-3'>面板3</a></li>

     </ul>

               <div id="tab-1">

                新闻:齐天大圣

                 </div>

                <divid="tab-2">

                新闻:齐天大圣-啊啊

                  </div>

                <divid="tab-3">

                新闻:齐天大圣-拜拜

                  </div>

 </div> 

jQuery插件2(拖拽draggable/放置droppable/排序sortable/面板折叠accordion/横向选项卡tabs/对话框dialog/menu/微调spinner/框提示)

1、拖曳插件——draggable 通过调用draggable()方法,实现各种拖曳元素的效果,调用格式如下: $(selector). draggable({options}) options...

JQuery UI之(三)可切换面板——tabs

一、          前言 Tabs组件的使用与dialog一样十分简单,  默认的配置即可实现最简单的tab, 通过设置更多的options可以实现更复杂的应用.   二、         ...
  • culous
  • culous
  • 2016年10月27日 22:14
  • 801

【jQueryUI】利用accordion、tabs与自定义面板布局

下面将用以下的一个布局,说明jQueryUI中accordion、tabs的应用,如何用.ui-widget-content与.ui-widget-header两个元素搞出面板。 以下是在IE8的测...

jquery_ui_tabs重要参考

  • 2013年09月04日 11:23
  • 77KB
  • 下载

jquery_选项卡_tabs_ui3g.com

  • 2015年05月25日 17:56
  • 2KB
  • 下载

jquery easyui 在子tab页中打开新tab页(关于easyUI在子页面增加显示tabs的一个问题)

文章转自:http://breezylee.iteye.com/blog/1762811 在父页面点个链接能动态看到子页面的情况太简单,请看easyUI官网:http://www.j...

jquery插件 tabs有实例

  • 2010年08月09日 11:39
  • 36KB
  • 下载

jquery tabs

  • 2012年01月12日 23:50
  • 6.32MB
  • 下载

Jquery-UI—制作选项卡(tabs)

使用Jquery-UI tabs方法制作简单选项卡

jquery 的 Tabs 插件

  • 2008年10月28日 22:48
  • 17KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jquery-tabs面板
举报原因:
原因补充:

(最多只允许输入30个字)