Follow-up: "Mouse-Over" Drop-Down Menus

[Larry R Harrison Jr]

I have them working now, courtesy of the link given in the prior thread--the
HVMenu over at Dynamic Drive myself.

http://www.dynamicdrive.com

I have them working as side-bar menus, not horizontal ones on TOP of the
page.

I figured it out and have it working fine, except for one thing--apparently
I need to insert the code for the menu for every last HTML file I have
practically.

This is not a big deal except that some of them are in different folders,
and thus many of the links don't work in the other locations because they're
"relative" links as opposed to "absolute" links. I figured that was the
better way--after all--with (as an example) img src tags in HTML, you also
just say "images/pic.jpg" rather than
http://www.mywebsite.com/sports/images/pic.jpg.; as long as the "relative"
location is right, it works. Plus, if you have a "contact us" page named
"contact_us.html" you also just say <a href="contact_us.html">Contact Us</a>
as opposed to <a
href="http://www.mywebsite.com/main/tutorials/contact_us.html">Contact
Us</a>.

Problem is, with the existence of the other folders the relative links don't
work in those locations.

It looks as though the thing to do is (a) make them absolute links--which
will then suck if I ever move the webpages to another domain etc or (b)
maintain different JS files for each folder--this would result in extra work
anytime I add new links (I'd have to add them to all the extra
exmplmenu_var.js files) or (c) create this with frames.

That is, with (c), have the menus in a left-hand side page with everything
opening on the right-hand side in a "frames" page. The problem with this,
though, is that when you go 2-3 levels deep you run out of space in the left
frame, and it gets ugly. Also, the special instructions given for if you
want to design them in a frameset--frankly, I'm not getting them.

Tips?

LRH

 

[Michael Winter]

[snip]

It looks as though the thing to do is (a) make them absolute
links--which will then suck if I ever move the webpages to another
domain etc or (b) maintain different JS files for each folder--
this would result in extra work anytime I add new links (I'd have to add
them to all the extra exmplmenu_var.js files) or (c) create this with
frames.

That is, with (c), have the menus in a left-hand side page with
everything opening on the right-hand side in a "frames" page. The
problem with this, though, is that when you go 2-3 levels deep you run
out of space in the left frame, and it gets ugly. Also, the special
instructions given for if you want to design them in a
frameset--frankly, I'm not getting them.

Tips?

You could try absolute URIs without the domain. If a URI starts with a
slash, it is interpreted relative to the current domain. This would allow
you place all of your site-wide scripts in a certain directory and the
path would be the same for all pages. For example,

http://www.site.org/js/script.js

can be referred to throughout using

/js/script.js

Even if you don't actually have a domain (you're hosted in a
subdirectory), this can still work. If you had to move hosts, all it would
take is a global search-and-replace of the front portion of the path
(unless you can use the same subdirectory). Not ideal, but not that hard,
either.

Finally, whatever you do, don't use frames.

Mike

 

[kaeli]

I figured it out and have it working fine, except for one thing--apparently
I need to insert the code for the menu for every last HTML file I have
practically.

This is why using templates for your pages is a good idea. You change the
template and all pages that use it are updated automagically. I like
Dreamweaver. You can get DWMX off Ebay for like $100. IMO, it's well worth
the money. I can redesign my template and update my whole site (hundreds of
pages) in minutes.
DWMX also takes care of the link issue - it makes the links for you. Change
the location of a file and it updates all the links appropriately. It also
has a function called "change links sitewide" (or something similarly
phrased) that lets you change all links from one spot to another.
I never want to develop and maintain a large site without DW.

That is, with (c), have the menus in a left-hand side page with everything
opening on the right-hand side in a "frames" page. The problem with this,
though, is that when you go 2-3 levels deep you run out of space in the left
frame, and it gets ugly. Also, the special instructions given for if you
want to design them in a frameset--frankly, I'm not getting them.

IMO, frames suck major ass for internet sites, but my intranet app uses them
and it uses HVMenu. What don't you get? I have a top frame, a left frame
where the menu is, and a main frame. The menu pops into the main frame. The
frames are invisible to my users.


The appropriate lines from my files:
========================================================================
exmplmenu_var.js:
var FirstLineFrame='leftFrame'; // Frame where first
level appears
var SecLineFrame='mainFrame'; // Frame where sub
levels appear
var DocTargetFrame='mainFrame'; // Frame where target
documents appear
var TargetLoc='myMenu'; // span id for relative
positioning

========================================================================
frameset:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>Order Processing System</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<%
// get the value of the session var that tells us the name of the frame to
load. If none, loads home.jsp
Object pageToLoad = session.getAttribute("page");
if (pageToLoad == null)
{
pageToLoad = "home.jsp";
}
%>
<frameset rows="51,*" cols="*" frameborder="no" border="0" framespacing="0"
class="f">
<frame src="top.jsp" name="topFrame" scrolling="no" noresize >
<frameset cols="83,*" frameborder="no" border="0" framespacing="0"
class="f">
<frame src="left.jsp" name="leftFrame" scrolling="no" noresize>
<frame src="<%= pageToLoad %>" name="mainFrame">
</frameset>
</frameset>
<noframes><body>

</body></noframes>
</html>
========================================================================
left.jsp (left frame):
<base target="mainFrame">
<script language="javascript">
function go(){return}
</script>
<script language="javascript" src="exmplmenu_var.js"></script>
<script language="javascript" src="menu_com.js"></script>
<div name="myMenu" id="myMenu" style='position:absolute; top:-1; left:0;
width:83px; height:18px;'><img src='spacer.gif' width='82' height='18'></div>
<p>&nbsp;</p>
========================================================================
In every page that loads in main frame:
<script language="javascript" type="text/javascript">
function doLoad()
{
// check that this is in the frameset properly
if (typeof parent.frames['topFrame'] != "object")
{
// reload
top.location.href="index.jsp";
}
else
{
parent.frames['topFrame'].document.location.reload();
if(parent.frames[0]&&parent.frames['leftFrame'].Go)
{
parent.frames['leftFrame'].Go();
}
}
}

</script>
....

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"
bgcolor="#ffffff" onload="doLoad()" onunload="if (parent.frames['leftFrame'])
parent.frames['leftFrame'].UnLoaded()">
========================================================================

Hope this helps.

--

 

[Csaba Gabor]

Another option that you have, if you have some control over
you web server, is to "rewrite" a file('s name). In particular,
if you give your javascript file some unique name (that you
won't accidentally duplicate in the future), then you can get
your web (http) server to use a specific file whenever you get
any request for that specific file name. In this case, you would
not prefix that javascript file name with any slashes or directory
names (which is what your question was about).

If you are using Apache, you could check out a module called
mod_rewrite. Note that I am not actually recommending it for
your particular situation, but I do mention it as a viable option.
It's a useful technique in general, and it works well. However,
you will have a steep learning curve in front of you if you go down
this path. Consider yourself warned.

As another poster implied, whatever you do, you write yourself
into one solution which could present complications if you port your
files. In this case, the risk would be that you moved to another
server where you couldn't duplicate the rewriting section you'd be
creating.

In a working example, which is beyond the scope of what you
are doing, I need to generate a custom .js file for each request,
so the .js file is actually a .php file (a custom program running on
the web server) which does what it needs to do and then returns a
javascript file:

httpd.conf contains:
<Directory C:/WebDirectory/Viewer>
RewriteEngine on
RewriteRule ^(tab|col)List.js$ $1List.php [NC,L]
</Directory>

In your case, you would not be restricting this type of rewriting
to a particular directory. The important line, by the way, is
the RewriteRule, which takes a request for tabList.js or colList.js
and transforms it to tabList.php or colList.php, respectively
and then executes that file.

Good luck,
Csaba Gabor from Budapest

 

[Robert]

This is not a big deal except that some of them are in different folders,
and thus many of the links don't work in the other locations because they're
"relative" links as opposed to "absolute" links.

../javascript/script.js


Also, you can go up a level with the .. and then come down with the /


Robert