Building the Imperfect Beast: Part 1 (menus.js)
January 19, 1999
The content of each menu will be contained within a discrete
layer. Ultimately, all of these layers will reside
within the spawned window which will behave as the pop-up
menu. It's important to remember that the content of
these menus must be easily modified by a non-programmer,
a person at the client's end who can maintain these pop
up menus in the future. We begin, then, by creating a
file containing the hyperlinks for the menus. This file merely
creates an array for each topic. Each array contains
the hyperlink data in pairs -- link text followed by link
URL. We've named this file menus.js.
menus.js
annuities_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html"
)
auto_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html",
"Link 3","http://link3.html"
)
business_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html",
"Link 3","http://link3.html",
"Link 4","http://link4.html"
)
health_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html",
"Link 3","http://link3.html"
)
home_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html",
"Link 3","http://link3.html"
)
life_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html",
"Link 3","http://link3.html"
)
personal_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html",
"Link 3","http://link3.html"
)
ratings_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html",
"Link 3","http://link3.html"
)
state_links=new Array(
"Link 1","http://link1.html"
)
toolbox_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html",
"Link 3","http://link3.html"
)
features_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html"
)
help_links=new Array(
"Link 1","http://link1.html",
"Link 2","http://link2.html",
"Link 3","http://link3.html"
)
sponsor_links=new Array(
"Link 1","http://link1.html"
)
|
Each array can essentially hold any number of links, but it
is quite crucial that proper
JavaScript syntax be adhered
to. Specifically, that means a comma between each entry
except after the final entry of the array. Additionally,
each entry must be contained within quotation marks, and we've
chosen to use double-quotation marks here. In a
case where the link text itself might need to contain a
quotation mark, such as Learning the "new"
math, one must use an escaped double-quotation mark
(\") within the link text. In other words: "Learning
the \"new\" math".
Isolating the menu contents within the discrete menus.js
file will benefit the client, who will not have
to wade through heavy program code to modify the menus.
All of the layout of the menus, meaning the layers, and some
of the control, meaning the menu behavior, will
be contained within a single file which will be loaded
into the spawned menu window, a file named popups.html.
The remaining code which spawns the menu window and pulls
its strings will be embedded into the client's original
page(s). We continue, then, by looking at the menu window
itself, popups.html.
The Great Layers Bug and Dead End Syndrome
DHTML Pop-Up Menus: A Parable of Triumph and Loss (Based on a True Story)
Building the Imperfect Beast: Part 2 (popups.html)
|
