Sliding menu using jQuery and ScrollTo

by Mr Me on February 21, 2010 in Downloads, html

Recently I created a sliding menu for a project using jQuery and ScrollTo functions.

We can use the jQuery function $(“.menubar”).scrollTo(id_of_element) to scroll any scrollable area to a particular location.

The idea behind every smooth sliding is using scroll function with overflow:hidden mode.

You can download the source code from : http://www.sajithmr.me/downloads/slider/slider.zip

Here div menu-bar is the scrollable div with overflow:hidden mode contains set of menu and a duplicate as a buffer

At the bottom of the code, you can see a filler div, this is for filling the menu one by one to the right side menu-bar to make the sliding very smooth

The function setMotion(this) calls the scroll function and it moves till the called DOM object’s id reaches

If you use an ajax call after the motion to load the content at the bottom, you can make this sliding menu for proper navigation purpose.

Thanks

Sajith

1 Comments featured, html, Javascript, jquery, menu, scroll, slider, source code

One Response to “Sliding menu using jQuery and ScrollTo”

oyun online May 14, 2010 at 3:12 am #

I learned it was good, thanks

Reply

About the author

Specialising in PHP, MVC, Agile, LAMP and iPhone Application Development, Sajith has over 5 years experience in the web programming industry during which time he has had his work featured in high profile lists on sites like Mashable. He was a talented and efficient member of the Cyber-Duck programming team, working alongside some of the best in the industry. Co-Founder of MobMe Wireless Pvt Limited, Sajith also has considerable experience in successful business management, having helped to excel the company to become listed as one of the "10 startups to watch in 2008" by the Wall Street Journal and by NASSCOM as one of the "100 most innovative companies in India", joining others like Texas Instruments, Tata Consultancy Services, Satyam and IBM. This technical blog is started three years before which now receives more than 120,000 visits each month and has more than 4000 subscribers.