• Jquery 下拉菜单动画效果[带演示]


    http://www.corange.cn//uploadfiles/3768jquery_menu_32233.jpg

    演示地址:http://www.corange.cn/demo/3768/index.html
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title></title>

    <link rel="stylesheet" href="demo.css" type="text/css" media="all">
    <link rel="stylesheet" href="jquery.dropSlideMenu.css" type="text/css" media="all">

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="jquery-ui-1.7.2.custom.min.js"></script>
    <script type="text/javascript" src="jquery.event.hover.js"></script>
    <script type="text/javascript" src="jquery.dropSlideMenu.js"></script>

    <script type="text/javascript">
    $(document).ready(function() {
    $("#navigation").dropSlideMenu({
    indicators: true, // adds a div to the list items for attaching indicators (arrows)
    clickstream: true, // highlights the clickstream in a menu by comparing the links to the current URL path
    openEasing: "easeOutQuad", // open animation effect
    closeEasing: "easeInQuad", // close animation effect
    duration: 600, // speed of drop down animation (in milliseconds)
    delay: 800, // delay before the drop down closes (in milliseconds)
    hideSelects: true // hide all select elements on the page when the menu is active (IE6 only)
    });
    });
    </script>
    </head>

    <body>
    <p>&nbsp;</p>
    <div id="container">
    <div id="navigation">
    <ul>
    <li><a href="/home">Home</a></li>
    <li><a href="">Planets</a>
    <ul>
    <li><a href="#">Mercury</a></li>
    <li><a href="#">Venus</a></li>
    <li><a href="#">Earth</a></li>

    </ul>
    </li>
    <li><a href="http://www.corange.cn">corange.cn</a>
    <ul>
    <li><a href="http://www.corange.cn/html/corange_6_1.html">asp</a></li>
    <li><a href="http://www.corange.cn/html/corange_15_1.html">js</a></li>

    </ul>
    </li>
    <li><a href="#">Oceans</a>
    <ul>
    <li><a href="/oceans/arctic">Arctic</a></li>
    <li><a href="/oceans/atlantic">Atlantic</a></li>

    </ul>
    </li>
    <li><a href="/about">About</a></li>

    </ul>
    </div>

    </div>
    </body>
    </html>

    原文地址:http://www.corange.cn/archives/2011/05/3768.html
  • 相关阅读:
    开源博客平台WordPress十岁啦!
    (转载)C# Attribute 用法备忘
    hibernate入门
    Hibernate对象关系映射基础
    struts2UI标签
    struts2文件上传2(多文件)
    struts2验证(手工)
    通过修改注册表改变txt文件的默认打开方式
    struts2验证(XML)
    Struts国际化
  • 原文地址:https://www.cnblogs.com/zerogo/p/2041807.html
Copyright © 2020-2023  润新知