六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 123|回复: 0

JQuery 实现选项卡效果

[复制链接]

升级  0.67%

13

主题

13

主题

13

主题

秀才

Rank: 2

积分
51
 楼主| 发表于 2013-2-7 20:50:07 | 显示全部楼层 |阅读模式
<script type="text/javascript" src="javascript/jquery.js"></script><script type="text/javascript" src="javascript/ui.core.js"></script><script type="text/javascript" src="javascript/ui.tabs.js"></script>  var tab;   jQuery(document).ready(function(){     //初始状态#workDiv > ul处于隐藏,此时使其显示,避免页面过渡现象出现jQuery("#workDiv > ul").css("display","");//产生tab标签    tab=jQuery("#workDiv > ul").tabs();    //使子信息标签不可用    //tab.tabs('disable', 1);  });

<br><div id="selectDiv" class="">    <ul style="display:none">    <li>    <a href="#iframe-1"><span>选项卡1</span></a>    </li>    <li>    <a href="#iframe-2"><span>选项卡2</span></a>    </li>    <li>    <a href="#iframe-3"><span>选项卡3</span></a>    </li>   </ul>   <div id="iframe-1" >    <iframe src="1.html" frameborder="0" style="width: 100%"></iframe>    </div>    <div id="iframe-2" >    <iframe src="2.html" frameborder="0" style="width: 100%;height: 30%"></iframe>    </div>    <div id="iframe-3" >    <iframe src="3.html" frameborder="0" style="width: 100%"></iframe>    </div></div>
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表