Jquery实现的tab效果可以指定默认显示第几页
更新时间：2013年10月16日 16:09:45 作者：
tab效果想必大家在网上都有见过很多吧，在本文将为大家介绍下如何实现可以在代码里面指定默认显示第几页的tab效果，感兴趣的朋友不要错过
可以在代码里面指定默认显示第几页
<div id="container" style="width:500px;">
<ul>
<li><a href="#fragment-1"><span>One</span></a></li>
<li><a href="#fragment-2"><span>Two</span></a></li>
<li><a href="#fragment-3"><span>Three</span></a></li>
</ul>
<div id="fragment-1"><a href="http://www.freejs.net/article_tabbiaoqian_29.html">jquery实现简单的Tab切换菜单</a></div>
<div id="fragment-2"><a href="http://www.freejs.net/article_jiaodiantu_56.html">jquery焦点图 slideshow</a></div>
<div id="fragment-3"> js等各种代码</div>
</div>
<script language="javascript">
$(function(){
//直接制作Tab菜单，默认选择为第二项，且切换的时候fade动画
$("#container > ul").tabs({fx:{opacity:"toggle",height:"toggle"}, selected:1});
});
</script>
注意上面的selected:1为控制默认显示第二页
复制代码 代码如下:
<div id="container" style="width:500px;">
<ul>
<li><a href="#fragment-1"><span>One</span></a></li>
<li><a href="#fragment-2"><span>Two</span></a></li>
<li><a href="#fragment-3"><span>Three</span></a></li>
</ul>
<div id="fragment-1"><a href="http://www.freejs.net/article_tabbiaoqian_29.html">jquery实现简单的Tab切换菜单</a></div>
<div id="fragment-2"><a href="http://www.freejs.net/article_jiaodiantu_56.html">jquery焦点图 slideshow</a></div>
<div id="fragment-3"> js等各种代码</div>
</div>
复制代码 代码如下:
<script language="javascript">
$(function(){
//直接制作Tab菜单，默认选择为第二项，且切换的时候fade动画
$("#container > ul").tabs({fx:{opacity:"toggle",height:"toggle"}, selected:1});
});
</script>
注意上面的selected:1为控制默认显示第二页
相关文章
这篇文章主要介绍了javascript中Object使用详解，非常全面详尽，有需要的小伙伴参考下2015-01-01
这篇文章主要介绍了详解redux异步操作实践，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-08-08
这篇文章主要介绍了解决webpack多页面内存溢出的方法示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-10-10
这篇文章主要介绍了web项目开发之JS函数防抖与节流实现的示例代码及原理解析，有需要的朋友可以借鉴参考下，希望能够有所帮助2021-09-09
很多小伙伴都在学习JavaScript,可能也会有老师提出这样一个问题,如何用js编写一个简单的验证码,这里就和大家分享一下,这篇文章主要给大家介绍了关于JavaScript实现图形验证码的相关资料,需要的朋友可以参考下2024-01-01
一个用js实现的页内搜索代码...2007-05-05
这篇文章主要介绍了Javascript中call的两种用法实例，有需要的朋友可以参考一下2013-12-12
这篇文章主要介绍了JS文件/图片从电脑里面拖拽到浏览器上传文件/图片,需要的朋友可以参考下2017-03-03
这篇文章主要介绍了js实现C#的StringBuilder效果,以完整实例形式分析总结了js实现C#的StringBuilder效果的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-12-12
Android 自定义view仿微信相机单击拍照长按录视频按钮
这篇文章主要介绍了Android 自定义view仿微信相机单击拍照长按录视频按钮，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值 ,需要的朋友可以参考下2019-07-07
最新评论