<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
<head>
|
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
|
<title>Spry Menu Bar Sample</title>
|
<script src="SpryMenuBar.js" type="text/javascript"></script>
|
<link href="SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
|
<link href="SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
|
</head>
|
|
<body>
|
<p>Horizontal</p>
|
<ul id="MenuBar1" class="MenuBarHorizontal">
|
<li><a class="MenuBarItemSubmenu" href="#">Item 1</a>
|
<ul>
|
<li><a href="#">Item 1.1</a></li>
|
<li><a href="#">Item 1.2</a></li>
|
<li><a href="#">Item 1.3</a></li>
|
</ul>
|
</li>
|
<li><a href="#">Item 2</a></li>
|
<li><a class="MenuBarItemSubmenu" href="#">Item 3</a>
|
<ul>
|
<li><a class="MenuBarItemSubmenu" href="#">Item 3.1</a>
|
<ul>
|
<li><a href="#">Item 3.1.1</a></li>
|
<li><a href="#">Item 3.1.2</a></li>
|
</ul>
|
</li>
|
<li><a href="#">Item 3.2</a></li>
|
<li><a href="#">Item 3.3</a></li>
|
</ul>
|
</li>
|
<li><a href="#">Item 4</a></li>
|
</ul>
|
<p> </p>
|
<p>Vertical</p>
|
<ul id="MenuBar2" class="MenuBarVertical">
|
<li><a class="MenuBarItemSubmenu" href="#">Item 1</a>
|
<ul>
|
<li><a href="#">Item 1.1</a></li>
|
<li><a href="#">Item 1.2</a></li>
|
<li><a href="#">Item 1.3</a></li>
|
</ul>
|
</li>
|
<li><a href="#">Item 2</a></li>
|
<li><a class="MenuBarItemSubmenu" href="#">Item 3</a>
|
<ul>
|
<li><a class="MenuBarItemSubmenu" href="#">Item 3.1</a>
|
<ul>
|
<li><a href="#">Item 3.1.1</a></li>
|
<li><a href="#">Item 3.1.2</a></li>
|
</ul>
|
</li>
|
<li><a href="#">Item 3.2</a></li>
|
<li><a href="#">Item 3.3</a></li>
|
</ul>
|
</li>
|
<li><a href="#">Item 4</a></li>
|
</ul>
|
<script type="text/javascript">
|
<!--
|
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryMenuBarDownHover.gif", imgRight:"SpryMenuBarRightHover.gif"});
|
var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2", {imgRight:"SpryMenuBarRightHover.gif"});
|
//-->
|
</script>
|
</body>
|
</html>
|
