<%@ 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>Insert title here</title>

<!-- 注意引进的文件顺序，你做的没有效果也许就是因为文件引进顺序不对！ -->

<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>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed 
diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat 
volutpat. </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自动切换tabs选项卡的更多相关文章

  1. 第二百节，jQuery EasyUI，Tabs(选项卡)组件

    jQuery EasyUI,Tabs(选项卡)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 5.选项卡面板 本节课重点了解 EasyUI 中 Tabs(选项卡)组件的使用方 ...

  2. 基于jQuery UI的tabs选项卡美化

    很多朋友对JS望而生畏,但听很多朋友说jQuery很简单,因此开始使用jQuery,使用之后发现,只会写简单的功能,复杂的功能还是不太会写或者总是担心自己写的有性能问题,对前端人员来说只能通过不断学习 ...

  3. jQuery 标签切换----之选项卡的实现

    这一次,我自己写了代码,先看html部分: <div class="tab"> <div class="tab_menu"> <u ...

  4. jquery Tabs选项卡切换

    效果: HTML部分: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  5. tabs自动切换功能的实现

    <html><head><!-- Bootstrap 核心 CSS 文件 --> <link rel="stylesheet" href= ...

  6. html+css+jQuery+JavaScript实现tab自动切换功能

    tab1.html内容 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  7. jquery背景自动切换特效

    查看效果网址:http://keleyi.com/a/bjad/4kwkql05.htm 本特效的jquery版本只支持1.9.0以下. 代码如下: <!DOCTYPE html PUBLIC ...

  8. jquery叠加页片自动切换特效

    查看效果:http://keleyi.com/keleyi/phtml/jqtexiao/34.htm 下面是HTML代码: <!DOCTYPE html> <html xmlns= ...

  9. HTML+JS+DOM【选项卡自动切换】

    最终效果图(鼠标无操作会自动切换选项卡): <!DOCTYPE html> <html> <head> <meta charset="gb2312& ...

随机推荐

  1. 使用.htaccess实现apache URL重定向

    一.什么是URL重定向? URL重定向(URL redirection,或称网址重定向或网域名称转址),是指当使用者浏览某个网址时,将他导向到另一个网址的技术. 二.URL重定向怎么配置? 1)首先需 ...

  2. No valid host was found

    set in nova.conf -> scheduler_default_filters=AllHostsFilter Tried without success.

  3. Spock Proxy

    Spock Proxy undefined 服务网关_百度搜索 undefined 8月2日,深圳 | DockOne技术沙龙开始报名啦 - DockOne.io undefined 知道创宇爬虫题- ...

  4. 【Java】通过DES加密和解密工具，对字符串进行加密和解密操作

    分享一个非常不错的字符串加密和解密的程序. 可以指定不同的密钥对同一字符串进行不同的加密操作,增强加密性能. Java代码如下: package com.app; import java.securi ...

  5. hdu 寒冰王座

    呵呵,过了这么久还来刷水题实在是不好意思.本题属于全然背包,就是一模板题.只是窝还是要来水一下.嘻嘻 寒冰王座 Time Limit: 2000/1000 MS (Java/Others)    Me ...

  6. spring 整合JDBC

    使用Spring提供的三个JDBC模板类(JdbcTemplate.NamedParameterJdbcTemplate.SimpleJdbcTemplate)操作数据库 一.JdbcTemplate ...

  7. [D3] 14. Line and Area Charts with D3

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  8. MFC程序实现给对话框加入�背景图片

    1.插入一个Bitmap的资源图片,如果资源名称为:IDC_BITMAP1 2.在CXXXDialog::OnPaint()中实现: void CMyDialogDlg::OnPaint() { if ...

  9. android开发的学习路线

    参考资料:千锋3G学院--课程大纲    http://www.mobiletrain.org 看了专业的培训机构的课程大纲,才知道,自己学习android的路途才刚刚开始!特此整理分享一下,希望能帮 ...

  10. 关于XCode5打开工程闪退的一种解决方案

    今天同事遇到一个问题,是关于xcode5打开工程文件一直闪退的问题.后来查看了一下崩溃日志.有如下描述: xception Type: EXC_CRASH (SIGABRT) Exception Co ...