August 3, 2005

HVMenu Frames Issue/Fix

With a project I’ve been working on, I’ve been using a great DHTML script called HVMenu found at Dynamic Drive. If you’re using it for a regularly formatted site (i.e. no frames) it works GREAT. But once you introduce frames (at least with the version on DD), it gets a bit ugly—specifically when you’re also linking to pages outside your domain and HAVE to keep that page within your site.

When you’re trying to do that, HVMenu version 5.whatever breaks and has a hissy fit. The menu fly-out doesn’t occur and if you try to force a refresh event in the javascript file, the menu doesn’t show up. You actually have to physically reload the page with the reload/refresh button. Unacceptable.

Allegedly version 9.whatever (available at http://www.burmees.nl/menu/) resolves this issue—but ONLY when you are linking to pages on the same domain. If you’re trying to link to pages outside of your domain using the menu app, it breaks down and says you don’t have permission to do what you’re trying to do.

Solution: introduce one more layer of frames.

Remember we’re still in the frames environment. For my example, I’ve got two frames: header.html and home.html contained within index.html, where my first frameset code is located.

First we’re going to create a new page called geturl.html, which is going to contain a new frameset. Here is what geturl.html will look like:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/html4/strict.dtd">
 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled</title>
 
<script type="text/javascript">
<!--
var url = (location.href);
var numberArray = new Array();
var numberArray = url.split ("?site=");
var showVariable = numberArray[1];
 
//–>
</script>
</head>
 
<script>
<!–
document.write(’<FRAMESET rows=”1,100%” border=”0″>’);
document.write(’<frame name=”blank” id=”blank” src=”blankpage.html” scrolling=”no” frameborder=”no”/>’);
document.write(’<frame name=”getcontent” id=”getcontent” src=”‘ + showVariable + ‘” frameborder=”no” scrolling=”yes”/>’);
document.write(’</FRAMESET>’);
//–>
</script>
 
<noframes>
<body topmargin=”0″ leftmargin=”0″ marginheight=”0″ marginwidth=”0″>
Your browser doesn’t support frames. Please enter the 21st century and download FireFox. You owe it to yourself.
</body>
</noframes>
 
</html>

What is happening here is that we’re going to send the URL that we want to this page in the form of geturl.html?site=http://www.externalsite.com/page.html. If I want to, I can also reference internal pages like this: geturl.html?site=mypage.html.

Now the index.html file, I’m going to change the frame src link that has home.html and change that to geturl.html?home.html. Make suer you also change all of your links in the _var.js file to fit this convention: geturl.html?site=yourlinkhere.html or geturl.html?site=http://somebodyelse.com. Also ensure that you’ve got the _var.js file properly configured to work with frames. See the documentation for that info.

For the most part things will work then. Occassionally—leaning towards rarely—the menu breaks and won’t show the fly-out menu for some odd reason. I haven’t been able to consistently duplicate the problem in order to figure out what breaks it. But it seems to work.

Hope that helps anyone having frames related trouble with HVMenu.

Digg This
August 3, 2005, 2:17 pm

* Filed under: HTML, JavaScript


Leave a Comment

You must be logged in to post a comment.