<!DOCTYPE html>
<html lang="en">
<meta http-equiv="content-type" content="text/html;charset=gb2312">
<head>
<title>jquery两级菜单带返回按钮 - 网页模板</title>
<link rel="stylesheet" href="css/reset.css" />
<link rel="stylesheet" href="css/text.css" />
<link rel="stylesheet" href="css/960.css" />
<link rel="stylesheet" href="css/style.css" type="text/css">
<!-- Javascript -->
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<!-- niceMenu includes -->
<link rel="stylesheet" href="css/niceMenu.css" type="text/css">
<script type="text/javascript" src="js/niceMenu.class.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// niceMenu init. Send custom option
niceMenu.init({
element : "#niceMenu",
hideStep : 199, // next step in size
duration : 200, // animation speed in miliseconds. 1000 = 1 second
nextIcon : 'images/niceMenu/menu_arraw.png', // url to next icon from menu
backBtn : 'a#niceMenu-backBtn', // back element menu
lastId : 0, // autoincrement in script
lastelm : 0, // autoincrement in script
currentStep : 0, // default 0. Autoincrement in script
running : false // prevent duble click colision
});
});
</script>
</head>
<body>
<div id="content">
<!--DEMO start-->
<div class="container_12">
<div id="headline" class="grid_12">
<h2>Nice menu vs 1.0</h2>
<p><em>Nice mode to browse between huge 2 levels menu.</em></p>
</div>
<div class="clear"></div>
<div class="grid_12">
<div class="boxItem grid_4">
<!-- niceMenu box -->
<div class="niceMenu">
<!-- niceMenu back button -->
<a href="#back" class="niceMenu-backBtn" id="niceMenu-backBtn"></a>
<div class="niceMenu-top"></div>
<div class="niceMenu-middle">
<div class="niceMenu-wrapper" id="niceMenu">
<ul>
<li>
<a href="#">Books</a>
<ul>
<li><a href="#">Arts & Photography</a></li>
<li><a href="#">Audiobooks</a></li>
<li><a href="#">Audible Audiobook Downloads</a></li>
<li><a href="#">Biographies & Memoirs</a></li>
<li><a href="#">Business & Investing</a></li>
<li><a href="#">Children's Books</a></li>
<li><a href="#">Christian Books</a></li>
<li><a href="#">Comics & Graphic Novels</a></li>
<li><a href="#">Computers & Internet</a></li>
<li><a href="#">Cooking, Food & Wine</a></li>
<li><a href="#">Crafts & Hobbies</a></li>
<li><a href="#">Entertainment</a></li>
<li><a href="#">Gay & Lesbian</a></li>
<li><a href="#">Health, Mind & Body</a></li>
<li><a href="#">History</a></li>
<li><a href="#">Literature & Fiction</a></li>
<li><a href="#">Mystery & Thrillers</a></li>
<li><a href="#">Nonfiction</a></li>
<li><a href="#">Outdoors & Nature</a></li>
<li><a href="#">Parenting & Families</a></li>
<li><a href="#">Puzzles & Games</a></li>
<li><a href="#">Reference</a></li>
<li><a href="#">Religion & Spirituality</a></li>
<li><a href="#">Teens</a></li>
<li><a href="#">Travel</a></li>
</ul>
</li>
<li>
<a href="#">Movies, Music</a>
<ul>
<li><a href="#">Movies & TV</a></li>
<li><a href="#">Blu-ray</a></li>
<li><a href="#">Video On Demand</a></li>
<li><a href="#">Music</a></li>
<li><a href="#">MP3 Downloads</a></li>
<li><a href="#">Musical Instruments</a></li>
<li><a href="#">Video Games</a></li>
<li><a href="#">Game Downloads</a></li>
</ul>
</li>
<li>
<a href="#">Digital Downloads</a>
<ul>
<li><a href="#">Kindle Store</a></li>
<li><a href="#">Audible Audiobooks</a></li>
<li><a href="#">Video On Demand</a></li>
<li><a href="#">MP3 Downloads</a></li>
<li><a href="#">Game Downloads</a></li>
</ul>
</li>
<li>
<a href="#">Electronics</a>
<ul>
<li><a href="#">TV & Video</a></li>
<li><a href="#">Home Audio & Theater</a></li>
<li><a href="#">Camera, Photo & Video</a></li>
<li><a href="#">Cell Phones & Accessories</a></li>
<li><a href="#">Video Games</a></li>
<li><a href="#">MP3 Players & Accessories</a></li>
<li><a href="#">Car Electronics & GPS</a></li>
<li><a href="#">Home Appliances</a></li>
<li><a href="#">Musical Instruments</a></li>
</ul>
</li>
<li>
<a href="#">Toys, Kids & Baby</a>
<ul>
<li><a href="#">Toys & Games</a></li>
<li><a href="#">Baby</a></li>
<li><a href="#">Clothing (Kids & Baby)</a></li>
<li><a href="#">Video Games for Kids</a></li>
</ul>
</li>
<li>
<a href="#">Sports & Outdoors</a>
<ul>
<li><a href="#">Exercise & Fitness</a></li>
<li><a href="#">Outdoor Recreation</a></li>
<li><a href="#">Athletic & Outdoor Clothing</a></li>
<li><a href="#">Team Sports</a></li>
<li><a href="#">Bikes & Scooters</a></li>
<li><a href="#">Golf</a></li>
<li><a href="#">Boating & Water Sports</a></li>
<li><a href="#">Fan Shop</a></li>
<li><a href="#">All Sports & Outdoors</a></li>
</ul>
</li>
<li><a href="#">Contact</a></li>
<li><a href="#">About us</a></li>
</ul>
</div>
</div>
<div class="niceMenu-bottom"></div>
</div>
</div>
<div class="grid_7">
<img src="images/demo.png" alt="demo" />
</div>
</div>
<div class="clear"></div>
<div id="footer" style="text-align: center; border-top: 1px solid #dddddd; margin-top:25px; padding-bottom: 20px;padding-top:5px;">
<p>© All Rights Reserved. Alexandra Ipate</p>
</div>
</div>
<!--DEMO end-->
</div>
<div style="text-align:center;clear:both">
<p>适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. </p>
<p>来源:<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p>
</div>
</body>
</html>