Mobile Horizontal Navigation

[analis]

This is my project a navigation menu.

It runs on the desktop , but for devices with touch screen does not work , when I click on the link disappears .

I do not think that with only css you can make it work .

you can arrange with pure javascript ?

http://codepen.io/anon/pen/QwqbeK

[Paulie_D]

you can arrange with pure javascript ?

Hi.

CSS-Tricks is not a code writing service. We love to help you figure out where your code isn’t working the way it should.

If you can show us what you have tried we can help you out but we’re generally not going to write it for you.

If someone here is generous enough to write something you won’t understand why it works or what it’s actually doing and you won’t learn anything.

If you don’t want to learn, that’s OK, but you should hire someone to do it for you.

In the meantime, this subject has come up recently in other threads..you might try looking through those.

Alternatively, try using a CSS framework like Bootstrap that will do a lot of this for you.

[analis]

hi

it is not an argument easy.

I read books , but there is very little.

know a bit of javascript but do not know where to start

[Shikkediel]

The main issue is in this bit :

#nh ul, #nh:active ul {
list-style:none;
display:none;
float:left;
margin-top:0px;
margin-right:5px;
}

Remove the #nh:active ul and it should work fine. Right now it hides the links when you click it (:active). Shouldn’t need a special JavaScript approach, clicks work on mobile as well.

Edit – apart from hover on the icon of course…

$('#icon').click(function() {$('#nh ul').toggle()});

Don’t mind I’m using jQuery here (needs a link to the library).
Here’s a pure JavaScript alternative :

http://www.wikihow.com/Toggle-HTML-Display-With-JavaScript

[analis]

thanks

works perfectly on Android!

I can not test on ios.

I thought of having to use force to javascript , however you do not need , so I can keep the pages lighter .

WOW

[Shikkediel]

Could well be Android simulates the hover event when the item is clicked. But I think on iStuff a bit of JavaScript is still needed.

[Author]

Posts