- This topic is empty.
January 21, 2015 at 10:17 pm #193914
I am working on a making my website responsive, but have run into an issue with the nav menu.
If you view the following page:
on something other than an iPhone (or a browser-width >480px), you should find that the menu works correctly. However, if you view the same page on an iPhone you will see that the nav menu does not work correctly. The nav menu is at the very bottom of the page, so you will have to scroll down to see it (on an iPhone).
I think that if I turn the menu into a simple linked-list, it may work, but I have not tried that yet. I am not fond of the nav menu being at the bottom of the page, but I do not know of any other way to do this and still keep the layout as simple as possible.
All comments and suggestions are most welcome.
PhillipJanuary 21, 2015 at 10:35 pm #193915
Thanks for the info as I was not aware of that. If I am thinking correctly, this will have to go into my media query. I appreciate the help.January 21, 2015 at 11:38 pm #193917
I could have a go at the menu on your site if you like (in jQuery).January 22, 2015 at 3:16 am #193926Paulie_DMember
Moving to JS JungleJanuary 22, 2015 at 9:40 am #193984
Thanks once again for your in-depth reply. Your comments have been an eye-opener for me for sure. I appreciate your jQuery offer, but for the time being I would like to stick with a purely CSS approach to this. I think my solution is to have a separate non-hover nav bar stylesheet triggered from my @media query. I will try this and see how it goes.
Thanks again for all of your help.
P.S. I have tried to mark this thread as SOLVED, but cannot seem to figure out how to do this as I see no checkbox to mark as solved. Thanks.January 22, 2015 at 10:42 am #193988
Only the mods can change the topic title like that, I guess it’s not the biggest though. Gimme a shout (here) if you decide to go jQuery.
CheersJanuary 22, 2015 at 11:13 am #193992Paulie_DMember
I think the OP can change the title too as they can edit any of their own posts.January 22, 2015 at 11:38 am #193997
Thanks for the info on marking the thread as ‘Solved’.
I, once again, am humbled by your offer of support and have one final question for you. If you take a look at Apple.com on an iPhone or similar mobile device, you will note their nav bar at the top. When you tap the left-side icon the nav titles fold down. From there you are able to finger-scroll the nav title’s horizontally. My question is this: Can that be done with purely CSS or does it require some jQuery?
Thanks!January 22, 2015 at 12:09 pm #194001
@Paulie_D, regular members only have a certain amount of time before the edit option on the posts is disabled…
Thanks for the feedback.
I think I am putting the cart in front of the horse by wanting all of this cool stuff in one fell swoop. (Disclosure: This is my very first website built from purely HTML/CSS. All of my past site experience has been using Rapidweaver, so I should be grateful that I have achieved what I have thus far.)
I appreicate your time and help.
PhillipJanuary 22, 2015 at 12:28 pm #194005