Home Upgrade Search Memberlist Extras Hacker Tools Award Goals Help Wiki Contact

Header Nav Menu Challenge

The community is having a problem on different mobile devices with the way the menu operates and displays. I'm calling on the community for assistance to help resolve this faster than I wold. Since I'm getting a lot of complaints and I haven't yet fixed this and I'm sucky at javascript I may as well ask for community help.

Here is the challenge. I want that navigation system we have. The header menu is going to stay. However, it doesn't function perfectly across some iPhone devices. Some report that it's fully open on each page. Others show screenshots where the nav isn't 100% width across the top.

Initially I was using initial-scale=1.0 for the viewport meta tag but I keep playing with it to see how it effects the mobile page. Right now viewport is .75 because members complained about the forum being zoomed.

Here is the files it uses:
https://hackforums.net/jscripts/topnav.js
https://hackforums.net/cache/themes/theme10/topnav.css

Our current viewport meta.
<meta name="viewport" content="width=device-width,initial-scale=1.0" />

And yes, I used a library and altered it for my needs. I am not ashamed of using a library, everyone does that. And for anyone who uses jquery, you're using a library too.
http://cssmenumaker.com/menu/jquery-resp...pdown-menu

So any pros that can help? I, and the community, would certainly appreciate it.
Wishing I wasn't a scrubber and had some skills to help xD
Can't you add hamburger menu for phone users? Would solve it all.
Or make the nav menu vertically for phone users?

I think one of those would fix our problems.
Or you want it to be same look even on phone?
I think you should try a different source code, the one you are using right now is 3 years old and won't work very well with latest devices. I found a better one.
https://www.smartmenus.org/download/
Demo: https://www.smartmenus.org/about/themes/

Without jQuery
Demo: http://bacsoftwareconsulting.com/blog/wp...menu-demo/
http://bacsoftwareconsulting.com/blog/in...out-jquery
I might be totally wrong, but I've had success before with changing the display. You have display style set on the "<ul>" tags. Try changing it to "relative" or "inline-block".
Try changing the position values to "fixed" and play with it. Some need a "fixed" position over a "absolute" position.
[Image: new.gif]
(Nov 7, 2017 10:49 AM)Omniscient Wrote:  Here is the challenge. I want that navigation system we have. The header menu is going to stay. However, it doesn't function perfectly across some iPhone devices.  Some report that it's fully open on each page.  Others show screenshots where the nav isn't 100% width across the top.

Hopefully someone helps out with this, makes HF quite hard to browse on my s8+.
 https://ibb.co/gX7DLw
Can you hear my weed?


cuz it's loud
I dont know if you're currently altering the code but i see this on android 6 with firefox:
https://i.imgur.com/ZwOX1bj.png

Jquery is a PITA.
@Crystallize. - Thanks for your help. He gave me some updated code that I have working right now.

Still in the process of trying to get this resolved and eventually it will be. I ask that members show patience while I try my hardest to improve and perfect our navigation for all devices and browsers (some task!).

Quote:Try changing the position values to "fixed" and play with it. Some need a "fixed" position over a "absolute" position.

Nope, made it much worse.

Quote:I dont know if you're currently altering the code but i see this on android 6 with firefox:

Yes, I'm aware that on certain mobile browsers this isn't working correctly.

I may just need to use a completely different menu system. This one may not work as we need it to.
Personally I use Hack Forums a lot via safari on my iPhone and everytime I browse a new page from there it extreme zooms me into making the menu look full screen, I will say forsure that the new menu looks way cleaner, glad to see you trying to make this perfect for everybody :)
(Nov 7, 2017 11:54 AM)Omniscient Wrote:  @Crystallize. - Thanks for your help.  He gave me some updated code that I have working right now.

Still in the process of trying to get this resolved and eventually it will be. I ask that members show patience while I try my hardest to improve and perfect our navigation for all devices and browsers (some task!).


Nope, made it much worse.


Yes, I'm aware that on certain mobile browsers this isn't working correctly.

I may just need to use a completely different menu system.  This one may not work as we need it to.


I think you are having main issue due to :hover option in case, it doesn't works on touchscreen devices. Current code is very old and practically useless on new devices.
(Nov 7, 2017 12:10 PM)Views Wrote:  Personally I use Hack Forums a lot via safari on my iPhone and everytime I browse a new page from there it extreme zooms me into making the menu look full screen, I will say forsure that the new menu looks way cleaner, glad to see you trying to make this perfect for everybody :)

Yeah i get this alot it zooms in on everything glad to see its looking to be fixed
Obviously working on it. Kind of screwed up right now but again, working on it.
I would also like to point out that for me on my iPhone, the page is zoomed in on page refresh.
It's zoomed in to the top right corner where the width goes across the nav bar (which is at like 60% of the oage).
I've been hacking Facebook and Gmail for 7 years. I have used exploits to gain access to many FB, IG, etc accounts without user's password.

If you’re serious about getting the job done, PM me about websites, accounts and databases.
(Nov 7, 2017 12:38 PM)iExploits Wrote:  I would also like to point out that for me on my iPhone, the page is zoomed in on page refresh.
It's zoomed in to the top right corner where the width goes across the nav bar (which is at like 60% of the oage).

already been stated. it does that for everyone thats on an Ios device.


Possibly Related Threads...
Thread / Author Replies Views Last Post
by reb00t_incApr 5, 2025 10:38 AM 12 342 Apr 5, 2025 10:38 AM
Last Post: Omniscient
by OmniscientJul 29, 2019 11:22 AM 27 739 Jul 29, 2019 11:22 AM
Last Post: Sectoral
by Dread Pirate RobertsOct 4, 2011 11:43 PM 12 129 Oct 4, 2011 11:43 PM
Last Post: Omniscient