jquery自動切換tabs選項(xiàng)卡的具體實(shí)現(xiàn)
本節(jié)內(nèi)容：
jquery實(shí)現(xiàn)自動切換選項(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>自動切換tabs選項(xiàng)卡-www.dhdzp.com</title>
<!-- 注意引進(jìn)的文件順序，你做的沒有效果也許就是因?yàn)槲募M(jìn)順序不對！ -->
<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>此處放置測試用的顯示內(nèi)容，自動切換tabs選項(xiàng)卡，自動切換tabs選項(xiàng)卡，自動切換tabs選項(xiàng)卡。
自動切換tabs選項(xiàng)卡，自動切換tabs選項(xiàng)卡，自動切換tabs選項(xià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)卡切換效果簡單演示
- jQuery實(shí)現(xiàn)的Tab滑動選項(xiàng)卡及圖片切換(多種效果)小結(jié)
- jQuery實(shí)現(xiàn)TAB選項(xiàng)卡切換特效簡單演示
- jQuery簡單實(shí)現(xiàn)tab選項(xiàng)卡切換效果
- jQuery實(shí)現(xiàn)Tab選項(xiàng)卡切換效果簡單演示
- 基于jquery實(shí)現(xiàn)最簡單的選項(xiàng)卡切換效果
- jQuery實(shí)現(xiàn)滾動切換的tab選項(xiàng)卡效果代碼
- jquery編寫Tab選項(xià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)二級下拉菜單效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)灰藍(lán)風(fēng)格標(biāo)準(zhǔn)二級下拉菜單效果代碼,涉及jquery鼠標(biāo)mouseover事件控制頁面元素樣式動態(tài)變換的實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08
Jquery實(shí)戰(zhàn)_讀書筆記1—選擇jQuery
近期公司積極組織我們這些開發(fā)人員學(xué)習(xí)進(jìn)步，督促我們學(xué)習(xí)更多的技術(shù)來提高自己。為此我選擇了jQuery作為我學(xué)習(xí)的方向，同時(shí)我也是想將我的學(xué)習(xí)心得分享給大家，以后我會不斷的更新一系列jQuery方面的學(xué)習(xí)紀(jì)要，幫助大家學(xué)習(xí)。2010-01-01
jQuery內(nèi)容過濾選擇器與子元素過濾選擇器用法實(shí)例分析
這篇文章主要介紹了jQuery內(nèi)容過濾選擇器與子元素過濾選擇器用法,結(jié)合實(shí)例形式分析了jQuery內(nèi)容過濾選擇器與子元素過濾選擇器相關(guān)功能、原理及使用方法,需要的朋友可以參考下2019-02-02
基于jquery ui的alert,confirm方案（支持換膚）
這篇文章主要介紹了基于jquery ui的alert,confirm方案（支持換膚），修改自網(wǎng)友的源碼，有需要的小伙伴參考下。2015-04-04
本文對jQuery的Cookie插件的使用方法和具體實(shí)例進(jìn)行系統(tǒng)介紹,有需要的朋友可以看下2016-11-11
JQuery.dataTables表格插件添加跳轉(zhuǎn)到指定頁
這篇文章主要介紹了JQuery.dataTables表格插件添加跳轉(zhuǎn)到指定頁的解決方案，非常不錯(cuò)，具有參考借鑒價(jià)值,需要的朋友可以參考下2017-06-06
基于 jQuery 實(shí)現(xiàn)鍵盤事件監(jiān)聽控件
這篇文章主要介紹了基于 jQuery 的鍵盤事件監(jiān)聽控件,需要的朋友可以參考下2019-04-04
jquery實(shí)現(xiàn)仿新浪微博評論滾動效果
這篇文章主要介紹了jquery實(shí)現(xiàn)仿新浪微博評論滾動效果,基于jquery實(shí)現(xiàn)頁面圖文定時(shí)滾動效果,涉及jquery頁面元素的遍歷與樣式的動態(tài)操作技巧,是一款經(jīng)典的jquery滾動特效,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-08-08
這篇文章主要介紹了jQuery選擇id屬性帶有點(diǎn)符號元素的方法,涉及jQuery選擇器的使用技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-03-03
淺析jQuery的鏈?zhǔn)秸{(diào)用之each函數(shù)
如果對于jquery的$()包裝器函數(shù)還不是很清楚，請先參閱我的上一篇日志：淺析jQuery的鏈?zhǔn)秸{(diào)用2010-12-12