Recent news

Monday, 2 May 2016

jQuery Dropdown Menu Like iPod Drilldown and Flyout styles Plugin



jQuery Menu is a dropdown menu with  iPod Drilldown and Flyout styles feature. This Plugin help to create a dropdown list with multi level items inside dropdown.

How To Use

1. Add the below mention library reference

<script type="text/javascript" src="https://www.filamentgroup.com/examples/menus/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="https://www.filamentgroup.com/examples/menus/fg.menu.js"></script>
<link type="text/css" href="https://www.filamentgroup.com/examples/menus/fg.menu.css" media="screen" rel="stylesheet" />
<link type="text/css" href="https://www.filamentgroup.com/examples/menus/theme/ui.all.css" media="screen" rel="stylesheet" />


2. Use the below html code to perform operation

<ul>
    <li><a href="#">Menu option</a></li>
    <li><a href="#">Menu option</a></li>
    <li>
        <a href="#">Menu option</a>
        <ul>
            <li><a href="#">Child menu option</a></li>
            <li><a href="#">Child menu option</a></li>
            <li><a href="#">Child menu option</a></li>
        </ul>
    </li>
    <li><a href="#">Menu option</a></li>
</ul>


3. Use the below code to make the dropdown
  
 $(document).ready(function () {
        $('#myMenuButton').menu({
            content: $('#myContent').html(),
            maxHeight: 180,
            positionOpts: { offsetX: 10, offsetY: 20 },
            showSpeed: 300
        });
    });




Pranav Singh Author: Pranav Singh

Hello, I am Author of this blog. The main purpose of this blog is to provide all the jQuery plugins which is helpful in designing and developing a web application in a single location from the web.

Previous
Next Post »

E-mail Newsletter

Sign up now to receive breaking news and to hear what's new with us.

Recent Articles