문제

Is there any jquery library using which it is possible to move menu bar horizontally? What I want to do is I have a menu bar which contains five items (Home, About Us, What We Do, Technologies, Contact Us). It is a dynamic menu bar and if the admin wants he can add more items to this menu bar. So suppose he adds three more items to the menu bar like (Item1, Item2, Item3) then new menu bar will look like (Home, About Us, What We Do, Technologies, Contact Us, Item1, Item2, Item3). And also he can add even more in future. Now what happens is on adding more items to the menu the newly added items are not displayed properly because page width is defined at 80% and it cannot be increased. So what I was trying to do is to provide a horizontally sliding menu. Means two arrows will be available at both the ends of the menu bar and visitor can press left pointing or right pointing arrow to access the menu items. Well so far I have not come across any jquery/javascript for this so I tried some other jqueries but they are for images and what happens is on pressing left or right arrow the whole menu slides but I want only one item to slide like on page load if user presses right arrow then home will be hidden and the menu bar will display like this (About Us, What We Do, Technologies, Contact Us, Item1). Mean on each right arrow press each leftmost item will hide and right most items will start showing up one by one. If you guys need more clarification I want Firefox like horizontally sliding functionality for my menu bar. In Firefox when more and more tabs are opened then after certain number of tabs two arrows appear at both ends and user can press arrows to slide and access the tabs. Thanks for your help in advance.

도움이 되었습니까?

해결책

A sliding menubar does not look good. I may suggest some plugin that you can find here

but, i suggest to change your mind about the design, and have something like this:

Menu Bar

When the user clicks on the Plus button, you can take him to a page where he can see as many options as he wants.

Or, add a drop down next to the menu bar where user can see all the options.

Menu Bar 2

다른 팁

Even if there are many such libraries present. You will yourself have to code them and use in your page. Or simply you can download a free template which makes use of it and edit it as per your requirement. Though using such free templates without proper license is not professional. You can try this though at the primary stages.

Do R & D on them.. edit and see the effects.. More you will spend time on understanding it more you will learn.. Wish you Good luck!!

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top