Home › Forums › JavaScript › Need help to finish mobile navigation
- This topic is empty.
-
AuthorPosts
-
September 26, 2017 at 6:42 am #260550FunkaholikParticipant
Hi y’all (Edo=)))
basically it needs a small fix
after you click on a nav link menu should close itselfplus i’m thinkin how to apply animation to elements inside targeted sections
and to nav buttons (kinda if they are active so they’ll say change color or else)September 26, 2017 at 9:00 am #260579ShikkedielParticipantNot sure I get it. If you close the menu, the nav buttons will be hidden?
September 26, 2017 at 9:20 am #260593FunkaholikParticipantwell nav is adaptive to screen size
in mobile view you see a menu toggle button always
click nav menu opens – click a button nav menu closed
there is an extra X-close button (if user changed his mind for example))September 27, 2017 at 3:52 am #260617ShikkedielParticipantOkay, so it’s just on small screens…
Just add another
hide
then?(function() { $('.selector').click(function() { var spot = $(this).index('.selector'); $('.windows').removeClass('active').eq(spot).addClass('active'); $('.menu').hide(); }); })();
That also messes with the large view though.
September 27, 2017 at 5:35 am #260621FunkaholikParticipantyep .. not cool at all.
is there a way to apply that function only for mobile view?
lock it to screen dimensions (media screen only etc)September 27, 2017 at 8:17 am #260643ShikkedielParticipantLol, I guess I missed the clue in the title. This ought to work:
if ($('.menu-show').is (':visible')) $('.menu').hide();
Edit – might need another line so there’s no issue when resizing, although I don’t think anyone will ever change orientation with 1440px involved.
September 27, 2017 at 9:26 am #260651FunkaholikParticipantwhat i’m trying to achieve here is
in a normal view when you click on nav buttons, related windows triggered show/hide
but when you’re in mobile view (i set with 1440px randomly just to show a mobile menu button)
mobile menu needs to be shut after you click or else you’ll have to close it manuallyright now in a normal view after click menu disapers and that’s a no-no ..
man, i’m stuck with those toggle windows thing, it’s easy to make a regular nav with links and few more pages=))but i like the fact that content changes without a page reload.
September 27, 2017 at 9:56 am #260653ShikkedielParticipantI’m on a 1920px monitor. :-)
That line was actually meant to replace the one suggested earlier…
(function() { $('.selector').click(function() { var spot = $(this).index('.selector'); $('.windows').removeClass('active').eq(spot).addClass('active'); if ($('.menu-show').is (':visible')) $('.menu').hide(); }); })();
September 27, 2017 at 10:08 am #260655FunkaholikParticipantthere was no ‘if’ before ))
thanx .. look for a new thread heheP.S. found a bug .. if in mobile view you’ll click a link and then resize to normal screen size
menu disappears .. not really sure why?September 27, 2017 at 11:39 am #260663ShikkedielParticipantI’ve added a resize function for it, just make sure to change it so it’s in line with the CSS media query.
September 27, 2017 at 12:36 pm #260666FunkaholikParticipantyou almost got it .. but if you’ll resize browser window
you’ll see that now in mobile view menu is alway openSeptember 27, 2017 at 3:20 pm #260694ShikkedielParticipantFixed me thinks.
September 28, 2017 at 12:39 am #260729FunkaholikParticipantHow you did that .. i don’t really see any changes.
September 28, 2017 at 11:58 am #260739ShikkedielParticipantWhat issue remains? Be a bit specific, por favor…
October 1, 2017 at 3:27 am #260770FunkaholikParticipantmy bad .. seems like everything is okay, thanx
-
AuthorPosts
- The forum ‘JavaScript’ is closed to new topics and replies.