Page History

Wiki Markup
{style:import=http://users.tpg.com.au/j_birch/plugins/superfish/css/superfish.css} {html}

...


<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"/>
<script type="text/javascript" src="http://users.tpg.com.au/j_birch/plugins/assets/js/hoverIntent.js"></script> 
<script type="text/javascript" src="http://

...

users.

...

tpg.com.au/j_birch/plugins/superfish/js/superfish.js"></script> 
<script type="text/javascript" src="http://users.tpg.com.au/j_birch/plugins/supersubs/js/supersubs.js"></script> 

<script type="text/javascript">

...

    $(document).ready(function(){

...


        $("ul.

...

sf-menu").

...

supersubs(

...

   minWidth:    12,   // minimum width of sub-menus in em units 
            maxWidth:    27,   // maximum width of sub-menus in em units 
            extraWidth:  1     // extra width can ensure lines don't sometimes turn over 
                               // due to slight rounding differences and font-family 
        }).superfish();  // call supersubs first, then superfish, so that subs are 
                         // not display:none when measuring. Call before initialising 
                         // containing tabs for same reason. 
    }); 
 
</script>

<ul class="sf-menu sf-js-enabled sf-shadow" id="sample-menu-5">
					<li class="current">
						<a href="#a" class="sf-with-ul">menu item<span class="sf-sub-indicator"> »</span></a>
						<ul style="float: none; width: 16.8462em; display: none; visibility: hidden;">
							<li style="white-space: normal; float: left; width: 100%;" class="">
								<a href="#aa" style="float: none; width: auto;">menu item that is quite long</a>
							</li>
							<li class="current" style="white-space: normal; float: left; width: 100%;">
								<a href="#ab" class="sf-with-ul" style="float: none; width: auto;">menu item<span class="sf-sub-indicator"> »</span></a>
								<ul style="left: 16.8462em; float: none; width: 20em; display: none; visibility: hidden;">
									<li class="current" style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item that is even longer still!</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#aba" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#abb" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#abc" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#abd" style="float: none; width: auto;">menu item</a></li>
								</ul>
							</li>
							<li style="white-space: normal; float: left; width: 100%;" class="">
								<a href="#" class="sf-with-ul" style="float: none; width: auto;">menu item<span class="sf-sub-indicator"> »</span></a>
								<ul style="left: 16.8462em; float: none; width: 12em; display: none; visibility: hidden;">
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
								</ul>
							</li>
							<li style="white-space: normal; float: left; width: 100%;" class="">
								<a href="#" class="sf-with-ul" style="float: none; width: auto;">menu item<span class="sf-sub-indicator"> »</span></a>
								<ul style="left: 16.8462em; float: none; width: 12em; display: none; visibility: hidden;">
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
								</ul>
							</li>
						</ul>
					</li>
					<li class="">
						<a href="#">menu item</a>
					</li>
					<li class="">
						<a href="#" class="sf-with-ul">menu item<span class="sf-sub-indicator"> »</span></a>
						<ul style="float: none; width: 12em; display: none; visibility: hidden;">
							<li style="white-space: normal; float: left; width: 100%;" class="">
								<a href="#" class="sf-with-ul" style="float: none; width: auto;">menu item<span class="sf-sub-indicator"> »</span></a>
								<ul style="left: 12em; float: none; width: 12em; display: none; visibility: hidden;">
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">short</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">short</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">short</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">short</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">short</a></li>
								</ul>
							</li>
							<li style="white-space: normal; float: left; width: 100%;" class="">
								<a href="#" class="sf-with-ul" style="float: none; width: auto;">menu item<span class="sf-sub-indicator"> »</span></a>
								<ul style="left: 12em; float: none; width: 12em; display: none; visibility: hidden;">
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
								</ul>
							</li>
							<li style="white-space: normal; float: left; width: 100%;" class="">
								<a href="#" class="sf-with-ul" style="float: none; width: auto;">menu item<span class="sf-sub-indicator"> »</span></a>
								<ul style="left: 12em; float: none; width: 12em; display: none; visibility: hidden;">
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
								</ul>
							</li>
							<li style="white-space: normal; float: left; width: 100%;" class="">
								<a href="#" class="sf-with-ul" style="float: none; width: auto;">menu item<span class="sf-sub-indicator"> »</span></a>
								<ul style="left: 12em; float: none; width: 12em; display: none; visibility: hidden;">
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;"><a href="#" style="float: none; width: auto;">menu item</a></li>
								</ul>
							</li>
							<li style="white-space: normal; float: left; width: 100%;" class="">
								<a href="#" class="sf-with-ul" style="float: none; width: auto;">menu item<span class="sf-sub-indicator"> »</span></a>
								<ul style="left: 12em; float: none; width: 12em; display: none; visibility: hidden;">
									<li style="white-space: normal; float: left; width: 100%;" class=""><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;" class=""><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;" class=""><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;" class=""><a href="#" style="float: none; width: auto;">menu item</a></li>
									<li style="white-space: normal; float: left; width: 100%;" class=""><a href="#" style="float: none; width: auto;">menu item</a></li>
								</ul>
							</li>
						</ul>
					</li>
					<li class="">
						<a href="#">menu item</a>
					</li>	
				</ul>

{html}

Child pages

Versions Compared

Old Version 4

New Version 5

Key