zoukankan      html  css  js  c++  java
  • 选项卡tab效果,动画

    选项卡tab效果,动画


    演示地址:http://www.corange.cn/demo/3770/index.html
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <title>Tab菜单</title>
    <link type="text/css" href="jquery.ui/flora.tabs.css" rel="stylesheet" />
    <style type="text/css">
    <!--
    body{
     background:#ffe7bc;
     font-size:12px;
     font-family:Arial, Helvetica, sans-serif;
    }
    -->
    </style>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
    <script language="javascript" src="jquery.ui/ui.base.min.js"></script>
    <script language="javascript" src="jquery.ui/ui.tabs.min.js"></script>
    <script language="javascript">
    $(function(){
     //直接制作Tab菜单,默认选择为第二项,且切换的时候fade动画
     $("#container > ul").tabs({fx:{opacity:"toggle",height:"toggle"}, selected:1});
    });
    </script>
    </head>
    <body>
    <div id="container">
     <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">www.corange.cn</div>
     <div id="fragment-2">asp,php</div>
     <div id="fragment-3"> js等各种代码</div>
    </div>
    </body>
    </html>

     原文地址:http://www.corange.cn/archives/2011/05/3770.html

  • 相关阅读:
    USACO Spinning Wheels
    USACO Agri-Net
    NOIP 2009 最优贸易
    USACO Cow Contest
    USACO Subset Sums
    USACO Cow Cars
    USACO Making the Grade
    NOIP 2008 传纸条
    NOIP 2000 方格取数
    NOIP 1999 导弹拦截
  • 原文地址:https://www.cnblogs.com/zerogo/p/2085729.html
Copyright © 2011-2022 走看看