Discussion on UI-Pro - Simple Metro Style Navigation Bar


wintercounter does not currently provide support for this item.

16 comments found.

Will we see this turned in a Google +1 like menu with multilevel ?

This plugin is intented to be as simple as it can be. It’s only for the functionality. Anyway, the next version may contain multilevel option and multiple menu types.

Does this work on mobile/tablets with touch only?

Tried on my Galaxy S, it’s working fine there.


I really like this menu. It makes sence in my App But a small Issue as ehe demo was not working out of the biox and this is not so nice ;-). The problem was the jquery reference.


I purchased this product. It is awesome. I would like to request one more feature to be added. I would like to have a javascript click event associated with each li. I sort of did this but it is not working for passing variable in the function call.

Can you please have this capability added? I am sure a lot of us will benefit from this feature.

Never mind. I got this fixed.

Hello there – I need some quick support. I have a twitter bootstrap navbar on the top and footer bar (sticky footer -another component bought here at codecanyon). I want to display ui-pro but want to cut off 50 px on the top and 50 px at the bottom to keep showing nav bar and footer. I was able to that bought it is not consistent across all browsers. Works only on Chrome. I thought I would ask you before I spend more time on it.

Let me know if u have a quick way of a fix that works for all browsers.

Hi, Give higher z-index to your navbars and lower to your slide in panel so the panel will go behind your navbars.

Thank’s for ure nice product :)

Can u tell how to change WIDTH of -> rightMenu : ’.the_ul’ ??

That’s not the right menu, you should search for #uipro_right in the CSS file, that has the width.

UI Pro works great but one of the menu item of UI pro opens up iframe that takes up all the available browser space. When that happens, UI pro does not work. It has higher z-index. I have tweeter bootstrap menu on top and when I mouse over on top corner (on top of tweeter bootstrap menu), UI pro shows up but does not show up if I just take mouse towards the edge. Can you please help? I am running out of ideas as how to show the UI pro menu on such condition. I am willing to pay if this needs your time and effort. It has become super critical for me.

Yes I did start iframe 2px from left, so I can always get left UI pro on mouseover at the edge. Still I did do some other adjustments so that it closes out immediately like instead of using mousemove, I used mouseout event in your UIpro.js file. It seemed to do the trick for the most part but at times, I feel like it is not smooth and gives an impression of buggy. I hope there is a way another way of over coming this browser issue of handling with iframe. If something strikes your mind let me know.

Also I wanted to check with you if there is way to show UIpro bar on the left even if user has scrolled the content to the right. Basically, I have page that has horizontal scrollbar since content flows to the right. And I am using UIPro on the left side. When scrolled to the right, the left UI pro no longer comes up. Only comes when scroll position is extreme left. Is there way to make this always show up regardless of scroll position. I hope I am making sense here.

I will make new methods to the script so you can envoke them on certain events. Sign up to my newsletter go get notification about the latest releases.

I also think that only mouseout is the solution like you did… Anyway, maybe some CSS adjustments will help, i’ll look into it.

I will keep checking here for new releases. Not sure how to subscribe for your newsletter or new releases without manually checking in. Thank you for your help. I am willing to pay some compensation for your efforts to get this fixed.

This is me again. Do you know – how to show up left nav UI only when taking the mouse to the edge of the screen and waiting for 1 second. Currently, if mouse is like 20 px away, the nav UI shows up.

You should need to add setTimout into the mousemove function. If it gets out of threshold before 1000 milisec is is up, than clearTimeout.

For the above problem I found the solution. I ditched your dynamically adding ‘active’ class and went with simple “hover” css and it worked flawlessly. I will keep testing though.

It also solved the horizontal scroller issue.

demo not working…

There is a full server lock while doing daily backup, i think you’ve visited the site right in that time…

wow thats some server…users have to “wait” for your demo lol – good time to switch to another server as you will easily lose customers….

It’s my own physical server serving hundreds of sites. I can’t risk losing clients data. That few minute downtime isn’t that much. Btw, we’ll change to a new backup method soon.

I need the new multilevel version of this vertical menu. Did you already released it?

Not yet, maybe in a new mayor release as it would need some radical changes.

Is a top/bottom menu possible (or planned?)

It was planned before, but i decided not to do it because users may don’t like when navigating on vertical pages. Anyway, if you really need it, i’ll do it in my next mayor release (don’t know when).

Hi, sorry for my English, I’m using goolge traslator.

I need to gernerar Menu multi-levels, as I can do?


I need to gernerar Menu multi-levels, as I can do?