This is a very simple item to add to any Allwebco template. Please keep in mind that we do not provide support for adding this to a template or webpage. This page covers all the details of this menu.
Example:
On the right side of this page is a sample of this floating menu. You will see a "Home", "Contact" and "top" button. Try scrolling down on this page or making your browser small in height and use your scrollbar to see the menu float. This menu works well on pages with lots of text. If you do not see this menu your browser may not support this floating menu.
Adding This To Your Template:
Step #1
Select your menu style and click below to download the "floating_menu.js" and images included in this add-on. See lower on this page to view menu styles. (there also is a download link under each menu set)
Step #2
Unzip this zip file. Put the floating_menu.js in your main template folder with your HTML pages. Put the .gif images in this zip file in your "picts" folder. The "ReadMe_floating.txt" in the download also includes instructions.
Step #3
Add the following code to the very bottom of any template HTML page you want the menu to be on. Be sure to add this just before the < /BODY>< /HTML> code at the page bottom: Add this code:
The floating menu should now be working. If not, remove this tag from the top of your HTML pages:
OPTIONS: Images:
You can replace the default .gif images in this menu download with your own .gif images and create a custom menu.
OPTIONS: Extra Buttons:
Here are the available menu styles. You can right click on any of these and choose to save them in your template "picts" folder, or download the zip file below with all images and the menu script included. Then see "Adding more items" below. These buttons were created with an 11 or 12 point Verdana font.
OPTIONS: Adding more items:
You can add more buttons to this menu. See the note in the "floating_menu.js" to do this. Also see the next option to make room for more buttons.
OPTIONS: Placing the menu up and down:
You can move this menu up or down on the page. Edit the "floating_menu.js" and find this code: "Yloc = 275;". Change the 275 to a larger number to move the menu up or smaller to move this down.
OPTIONS: Placing the menu left or right:
You can place the menu on the left or right side. Edit the "floating_menu.js" and find this code: "right=x;". Change this to left or right.
OPTIONS: Changing links:
You can change what these images link to. Edit the "floating_menu.js" in Notepad and for example change the "index.html" to link to any page you would like.
TROUBLESHOOTING: If the "top" link does not work:
If the top link is not working. Add this code just after the "body" tag near the top of the HTML page:
TROUBLESHOOTING: If the menu is not working:
Go through the steps again. If this does not work:
- Check the information that is in the "ReadMe_floating.txt" in the floating menu download.
- Try the steps again from the start on another HTML page.
- The menu may be under another item on your page. This can not go over any flash animation.
- Your browser is not compatible with this script.
- On some websites or templates such as Ministes you must remove or modify this tag at the top of each HTML page for this menu to float:
Related Topics:
Unzipping Files
More Scripts
source: allwebco-templates.com
