What's wrong with my responsive menu?

Question

Check it out here: http://bit.ly/16DJQjN

When I resize the window down to a lower resolution, everything is fine, the navigation menu turns into mobile version. But just try to get the page narrower and refresh the page, you'll see the items drop down one after another in an irregular way, just resize it once more, it's perfect again. That way, it doesn't seem alright on lower resolution devices when first opened.

To give you an idea of what it looks like, that's how it looks when the page is opened in this resolution. enter image description here

But when I just resize it in any way, it looks perfect, see:

enter image description here

I checked the JS and CSS, obviously it's not done with media-queries thing, I believe it's pure jS. How do I fix it? Can you help me?

this is working fine when page fully loaded. before loading page the js or css not loading so it is display one after one. — Love Trivedi, Sep 18 '13 at 10:00
When I open it on a browser that was resized down to less than 1280px wide and refresh the page, it looks terrible? — ofer dofer, Sep 18 '13 at 10:02
Is it because of $(window).resize(function() function not triggered after load? — Mon Noval, Sep 18 '13 at 10:51
@MonNoval how do I trigger that? And where to put the codes? — ofer dofer, Sep 18 '13 at 12:11
You can actually follow the checked answer in this link http://stackoverflow.com/questions/2597152/jquery-window-resize-doesnt-work-on-load — Mon Noval, Sep 20 '13 at 03:19
In your http://prenatest.com.tr/test/js/cust.js you have the window resize function. You need to update this part. I think. — Mon Noval, Sep 20 '13 at 03:21

score 0 · Answer 1 · answered Sep 18 '13 at 10:52

0

Add this css to your style sheet this will hide menu until javascript load.

.responsive_nav ul{
    display:none;
}

answered Sep 18 '13 at 10:52

Love Trivedi

3,899
3
20
26

What's wrong with my responsive menu?

1 Answers1