View Full Version : Question about Responsive SideToggle Menu also

01-03-2018, 03:26 PM
1) Script Title: Responsive Side Toggle Menu

2) Script URL (on DD): * Responsive Side Toggle Menu(c) Dynamic Drive (www.dynamicdrive.com)
* Last updated: July 21, 15'
* Visit http://www.dynamicdrive.com/ for this script and 100s more.

3) Describe problem:
Hello! I would like to use your Responsive Side Toggle menu for my website.
I've set it up and I really like it and it works beautifully.
It uses a button for "Toggle Menu 1" and "Toggle Menu 2" ,which is great.
However, my pages are rather long and the buttons don't stay "fixed" at the top
of the viewed part of the page, they scroll out of site as the viewer scrolls down.
Is there a way to make the buttons be "fixed"?
I've tried everything I can think of, also I've posted the question on Invisionzone, the W3schools forum site
but so far no reply.
Can you help me?
John (keytoner)

01-03-2018, 09:49 PM
You can make the buttons fixed by using 'position: fixed'. Examples:

<button onClick="menu1.toggle()" class="sideviewtoggle" style="position: fixed; top:2px; left:2px">Toggle Menu 1</button>
<button onClick="menu2.toggle()" class="sideviewtoggle" style="position: fixed; top:2px; right: 2px">Toggle Menu 2</button>

Note that these positions given to the toggle buttons will make them invisible when the menu(s) expand(s). In order for the buttons not to be hidden by the menus, you have to make sure that the top position for the menus is not '0' (= the default top position in sidetogglemenu.js), but, say, '50px' (or higher). It's very easy to edit sidetogglemenu.js. Open the file, look for the line that starts with $menu = $(menuref).css, then replace top: 0 with top: '50px' (or something similar). You also have to make a changement in sidetogglemenu.css. Open that file, look for height: 100% and replace that with height:calc(100% - 50px).

01-03-2018, 10:31 PM
Thanks a Million -Arie !
I'm beginning to understand why NASA never calls me for advice!
John (keytoner)