How To Fix Position Of Menu Toggle [ON]

• 

  hrhngx · Member · Dec 18, 2014 at 7:25 pm

  • Copy link
  • Add topic to favorites

  When I fix the position of my menu toggle/button [OFF as .menu-toggle], the one near open slide-menu [ON as .menu-toggle.x.toggle-on] just disappears…
  How can I make the position of menu toggle/button fixed in both forms successfully?

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Dec 20, 2014 at 7:11 pm

  • Copy link

  Can you explain a little more what you are trying to accomplish?

• 

  hrhngx · Member · Dec 20, 2014 at 10:08 pm

  • Copy link

  My menu button is on the right-top corner as 3 horizontal lines and when we click it to open slide-menu, this 3 horizontal line button transforms to a 2 cross line button as X near the opened slide-menu…
  I’d just like to change the rule for 3 horizontal line button as “position: fixed” in order to make it always accessible on the corner when the viewers/visitors scroll-down pages…
  But when I do this change, the button X just disappears as if a “display: none” rule is added for it…
  How can I fix both successfully, sir?

• 

  hrhngx · Member · Dec 23, 2014 at 5:21 am

  • Copy link

  Update: I’ve just noticed that the close button [X] is fixed just in the same way the open button [triple-line] is; in the deep top-right corner of pages…
  So the close button [X] was just hidden/covered under my slide-menu background…
  I’ve corrected it as “position: absolute” separately…

  And now, my only problem still remaining is:
  When I scroll down pages and click the open button [already fixed successfully], the close button [X] still insists on staying on the top of pages and obligates to scroll up; to go back to the top to be found there…
  How can I complete this revision successfully?

• 

  thesacredpath · Member · Dec 23, 2014 at 5:13 pm

  • Copy link

  First, change position: absolute in the following rule to “fixed” and add a left declaration of 500px.

  .menu-toggle.x.toggle-on {
      background: none repeat scroll 0 0 transparent;
      border: medium none transparent;
      position: fixed;
      left: 500px;
  }

  and then add this also:

  .site-header {
      position: relative;
  }

• 

  hrhngx · Member · Dec 23, 2014 at 11:04 pm

  • Copy link

  Now all clear about my menu toggle thanks to you again [not sure how many times] and again, sir!
  As I see, we’ve just fixed it in both forms successfully and also adjusted its left/right position manually in order to keep it visible; in case it goes hidden under slide-menu again, right?
  And thank you very much again, sir!
  Well, you are simply the best…

• 

  thesacredpath · Member · Dec 26, 2014 at 5:56 pm

  • Copy link

  You are welcome and your site is looking great!