jquery自動(dòng)切換tabs選項(xiàng)卡的具體實(shí)現(xiàn)
本節(jié)內(nèi)容：
jquery實(shí)現(xiàn)自動(dòng)切換選項(xiàng)卡。
代碼：
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>自動(dòng)切換tabs選項(xiàng)卡-www.fzitv.net</title>
<!-- 注意引進(jìn)的文件順序，你做的沒(méi)有效果也許就是因?yàn)槲募M(jìn)順序不對(duì)！ -->
<script type="text/javascript" src="<%=path %>/js/jquery-1.2.6.js"></script>
<script src="<%=path%>/js/ui.core.js" type="text/javascript"></script>
<link href="<%=path%>/css/ui.tabs.css" rel="stylesheet" type="text/css" />
<script src="<%=path%>/js/ui.tabs.js" type="text/javascript"></script>
<style type="text/css">
code {
font-family: "Courier New", Courier, monospace;
}
</style>
<script type="text/javascript">
$(function() {
alert(1);
$('#rotate > ul').tabs({ fx: { opacity: 'toggle' },selected:0}).tabs('rotate', 500000);
});
</script>
</head>
<body>
<hr size="10" color="red"/>
<H1>Rotating UI Tabs example</H1>
<div id="rotate">
<ul>
<li><a href="#div1"><span>新聞</span></a></li>
<li><a href="#div2"><span>論壇</span></a></li>
<li><a href="#div3"><span>博客</span></a></li>
</ul>
<div id="div1"><h4>DIV1</h4>此處放置測(cè)試用的顯示內(nèi)容，自動(dòng)切換tabs選項(xiàng)卡，自動(dòng)切換tabs選項(xiàng)卡，自動(dòng)切換tabs選項(xiàng)卡。
自動(dòng)切換tabs選項(xiàng)卡，自動(dòng)切換tabs選項(xiàng)卡，自動(dòng)切換tabs選項(xiàng)卡。自動(dòng)切換tabs選項(xiàng)卡。</div>
<div id="div2"><h4>DIV2</h4>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed
diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
</div>
<div id="div3"><h4>DIV3</h4>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed
diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh
euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </div>
</div>
</body>
</html>
- jQuery實(shí)現(xiàn)選項(xiàng)卡切換效果簡(jiǎn)單演示
- jQuery實(shí)現(xiàn)的Tab滑動(dòng)選項(xiàng)卡及圖片切換(多種效果)小結(jié)
- jQuery實(shí)現(xiàn)TAB選項(xiàng)卡切換特效簡(jiǎn)單演示
- jQuery簡(jiǎn)單實(shí)現(xiàn)tab選項(xiàng)卡切換效果
- jQuery實(shí)現(xiàn)Tab選項(xiàng)卡切換效果簡(jiǎn)單演示
- 基于jquery實(shí)現(xiàn)最簡(jiǎn)單的選項(xiàng)卡切換效果
- jQuery實(shí)現(xiàn)滾動(dòng)切換的tab選項(xiàng)卡效果代碼
- jquery編寫Tab選項(xiàng)卡滾動(dòng)導(dǎo)航切換特效
- jquery實(shí)現(xiàn)選項(xiàng)卡切換代碼實(shí)例
- jQuery實(shí)現(xiàn)選項(xiàng)卡切換圖片
相關(guān)文章
jQuery實(shí)現(xiàn)灰藍(lán)風(fēng)格標(biāo)準(zhǔn)二級(jí)下拉菜單效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)灰藍(lán)風(fēng)格標(biāo)準(zhǔn)二級(jí)下拉菜單效果代碼,涉及jquery鼠標(biāo)mouseover事件控制頁(yè)面元素樣式動(dòng)態(tài)變換的實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08
Jquery實(shí)戰(zhàn)_讀書筆記1—選擇jQuery
近期公司積極組織我們這些開發(fā)人員學(xué)習(xí)進(jìn)步，督促我們學(xué)習(xí)更多的技術(shù)來(lái)提高自己。為此我選擇了jQuery作為我學(xué)習(xí)的方向，同時(shí)我也是想將我的學(xué)習(xí)心得分享給大家，以后我會(huì)不斷的更新一系列jQuery方面的學(xué)習(xí)紀(jì)要，幫助大家學(xué)習(xí)。2010-01-01
jQuery內(nèi)容過(guò)濾選擇器與子元素過(guò)濾選擇器用法實(shí)例分析
這篇文章主要介紹了jQuery內(nèi)容過(guò)濾選擇器與子元素過(guò)濾選擇器用法,結(jié)合實(shí)例形式分析了jQuery內(nèi)容過(guò)濾選擇器與子元素過(guò)濾選擇器相關(guān)功能、原理及使用方法,需要的朋友可以參考下2019-02-02
基于jquery ui的alert,confirm方案（支持換膚）
這篇文章主要介紹了基于jquery ui的alert,confirm方案（支持換膚），修改自網(wǎng)友的源碼，有需要的小伙伴參考下。2015-04-04
本文對(duì)jQuery的Cookie插件的使用方法和具體實(shí)例進(jìn)行系統(tǒng)介紹,有需要的朋友可以看下2016-11-11
JQuery.dataTables表格插件添加跳轉(zhuǎn)到指定頁(yè)
這篇文章主要介紹了JQuery.dataTables表格插件添加跳轉(zhuǎn)到指定頁(yè)的解決方案，非常不錯(cuò)，具有參考借鑒價(jià)值,需要的朋友可以參考下2017-06-06
基于 jQuery 實(shí)現(xiàn)鍵盤事件監(jiān)聽控件
這篇文章主要介紹了基于 jQuery 的鍵盤事件監(jiān)聽控件,需要的朋友可以參考下2019-04-04
jquery實(shí)現(xiàn)仿新浪微博評(píng)論滾動(dòng)效果
這篇文章主要介紹了jquery實(shí)現(xiàn)仿新浪微博評(píng)論滾動(dòng)效果,基于jquery實(shí)現(xiàn)頁(yè)面圖文定時(shí)滾動(dòng)效果,涉及jquery頁(yè)面元素的遍歷與樣式的動(dòng)態(tài)操作技巧,是一款經(jīng)典的jquery滾動(dòng)特效,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-08-08
jQuery選擇id屬性帶有點(diǎn)符號(hào)元素的方法
這篇文章主要介紹了jQuery選擇id屬性帶有點(diǎn)符號(hào)元素的方法,涉及jQuery選擇器的使用技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-03-03
淺析jQuery的鏈?zhǔn)秸{(diào)用之each函數(shù)
如果對(duì)于jquery的$()包裝器函數(shù)還不是很清楚，請(qǐng)先參閱我的上一篇日志：淺析jQuery的鏈?zhǔn)秸{(diào)用2010-12-12