Superfish-menus

From ThaiiS Note (Wiki)

• http://users.tpg.com.au/j_birch/plugins/superfish/#getting-started
• download : http://users.tpg.com.au/j_birch/plugins/superfish/superfish-1.4.8.zip

js

<script language="javascript" src="/path/to/jquery-X.Y.Z.min.js"></script>
<link rel="stylesheet" type="text/css" href="/path/to/superfish.css" />
<link rel="stylesheet" type="text/css" href="/path/to/superfish-vertical.css" />
<script language="javascript" src="/path/to/superfish.js"></script>

<script language="javascript">

$(document).ready(function() {
	$('ul.sf-menu').superfish();
});

</script>

html

<ul class="sf-menu">

    <li><a href="#">Item 1</a>
        <ul>
            <li><a href="#">Subitem 1.1</a>
                <ul>
                    <li><a href="#">Subitem 1.1.1</a></li>
                    <li><a href="#">Subitem 1.1.2</a></li>
                    <li><a href="#">Subitem 1.1.3</a></li>
                </ul>
            </li>
            <li><a href="#">Subitem 1.2</a></li>
            <li><a href="#">Subitem 1.3</a></li>
            <li><a href="#">Subitem 1.4</a></li>
        </ul>
    </li>
   
    <li><a href="#">Item 2</a>
        <ul>
            <li><a href="#">Subitem 2.1</a></li>
            <li><a href="#">Subitem 2.2</a></li>
            <li><a href="#">Subitem 2.3</a></li>
            <li><a href="#">Subitem 2.4</a></li>
        </ul>
    </li>
   
    <li><a href="#">Item 3</a>
        <ul>
            <li><a href="#">Subitem 3.1</a></li>
            <li><a href="#">Subitem 3.2</a></li>
            <li><a href="#">Subitem 3.3</a></li>
            <li><a href="#">Subitem 3.4</a></li>
        </ul>
    </li>

</ul>