
jwTabs是Jeffrey制作的一个基于jQuery的Tab插件,与比较出名的idTab相比,它具有以下优点:
1. 可以自由选择过渡效果2. 可以自动切换Tab3. 插件大小只有1K4. Has everything you’d actually use…and nothing more.(怎么翻译?)5. 不需要对代码进行特殊标记
插件的主页是:Introducing jwTabs
例子:
假设你需要对以下代码进行Tab处理:
<div id="tab-container"> <div> <h2>1st tab</h2> <p> .......</p> </div> <div> <h2>2nd tab</h2> <p>......</p> </div> <div> <h2>3rd tab</h2> <p>......</p> <p>......</p> <p>......</p> </div> <div> <h2>4th tab</h2> <p>......</p> </div> <div> <h2>5th tab</h2> <p>......</p> </div> <div> <h2>6th tab</h2> <p>......</p> </div> </div>
不需要对HTML再作任何处理,只需要添加以下脚本:
jQuery('#tab-container').jwTabs({ interval : 6000,//自动切换Tab的时间间隔,单位ms startTab : 4,//默认显示的Tab序号 tabTitleReference : 'h2'//Tab标签的标题});
人吐槽 | 人点赞 |
发表评论