PDA

View Full Version : [DHTML] HV menus: customizations for frameset use.



molendijk
11-12-2007, 02:24 PM
1) CODE TITLE: HV menus on top of frameset

2) AUTHOR NAME/NOTES: Since there were some questions regarding the thread I started here (http://www.dynamicdrive.com/forums/showthread.php?t=25009), I examined how to put the HV menu and the HV Popmenu on top of a frameset.

3) DESCRIPTION: Technique for having the HV menus designed for non-frameset use across a frameset.

4) URL TO CODE: http://molendijk.110mb.com/dynamicHV/

or, ATTACHED BELOW (see #3 in guidelines below):

molendijk
12-09-2007, 10:51 AM
Sorry, the server (for the link given above) is down and I don't seem to have the possibility of editing my post. So her (http://molendijk.110mb.com/dynamicHV/)e's another link.

Arie Molendijk.

djr33
12-09-2007, 11:12 AM
Updated your post for you.

molendijk
12-09-2007, 05:05 PM
Updated your post for you.
Thanks!

molendijk
12-09-2007, 06:45 PM
Hello Daniel,
Could you also update the following links, which also point to the dead server:

1) Thread started at http://www.dynamicdrive.com/forums/showthread.php?t=25009, new link: http://molendijk.110mb.com/dynamic/

2) Thread started at http://www.dynamicdrive.com/forums/showthread.php?t=26304&highlight=Correct+Molendijk, new link: http://molendijk.110mb.com/CorrectUrl/

Thanks in advance,
Arie Molendijk

djr33
12-10-2007, 12:05 AM
They've been updated.

molendijk
12-10-2007, 08:12 AM
Thanks again!
Arie Molendijk.

aawan
12-26-2007, 08:01 PM
Arie,

I have the same problem, however, my page does not use frames.
I just use the HV menu, and the page happens to have an iframe embedded. No other frameset exists on the page. However, the menu breaks and does not display when I have an iframe on that page.

How would I use/customize this solution in that case?

Thanks,
Ali

molendijk
12-26-2007, 10:21 PM
Do you have a link to your page, so that I can see what might be the problem?

Arie.

aawan
12-28-2007, 04:11 PM
No, it's on my computer, w/o a public domain.
Can I email you the source?

Thanks,
Ali

molendijk
12-28-2007, 08:56 PM
Aawan, sure, see my profile.

Arie M.

aawan
01-04-2008, 03:46 AM
Arie,

I have sent you the code.

Please let me know if you received it.

Thanks again,
Ali

molendijk
01-05-2008, 01:32 PM
Ali,
I only received your js files: menu_com and menu_var, not the html. So I made a simple test.html of my own, and put your js-files in it, together with an iframe. Your menu shows properly in front of the iframe, exactly as it should be. By the way, your menu doesn't have submenus, so I don't see how the iframe could hide submenus in the first place.
Note: your iframe shouldn't have a heigh z-index. That would hide the menu.

Arie.

molendijk
01-08-2008, 02:32 PM
Ali,
there was something wrong with your menu_var.js. I made some modifications. Here is the code. It should work now.


/***********************************************************************************
* (c) Ger Versluis 2000 version 5.411 24 December 2001 (updated Jan 31st, 2003 by Dynamic Drive for Opera7)
* For info write to menus@burmees.nl *
* You may remove all comments for faster loading *
***********************************************************************************/

var NoOffFirstLineMenus=5; // Number of first level items
var LowBgColor='C0C0C0'; // Background color when mouse is not over
var LowSubBgColor='white'; // Background color when mouse is not over on subs
var HighBgColor='C0C0C0'; // Background color when mouse is over
var HighSubBgColor='black'; // Background color when mouse is over on subs
var FontLowColor='white'; // Font color when mouse is not over
var FontSubLowColor='121F50'; // Font color subs when mouse is not over
var FontHighColor='white'; // Font color when mouse is over
var FontSubHighColor='white'; // Font color subs when mouse is over
var BorderColor='black'; // Border color
var BorderSubColor='black'; // Border color for subs
var BorderWidth=1; // Border width
var BorderBtwnElmnts=1; // Border between elements 1 or 0
var FontFamily="arial,comic sans ms,technical" // Font family menu items
var FontSize=9; // Font size menu items
var FontBold=1; // Bold menu items 1 or 0
var FontItalic=0; // Italic menu items 1 or 0
var MenuTextCentered='left'; // Item text position 'left', 'center' or 'right'
var MenuCentered='left'; // Menu horizontal position 'left', 'center' or 'right'
var MenuVerticalCentered='top'; // Menu vertical position 'top', 'middle','bottom' or static
var ChildOverlap=.2; // horizontal overlap child/ parent
var ChildVerticalOverlap=.2; // vertical overlap child/ parent
var StartTop=0; // Menu offset x coordinate
var StartLeft=1; // Menu offset y coordinate
var VerCorrect=0; // Multiple frames y correction
var HorCorrect=0; // Multiple frames x correction
var LeftPaddng=3; // Left padding
var TopPaddng=2; // Top padding
var FirstLineHorizontal=1; // SET TO 1 FOR HORIZONTAL MENU, 0 FOR VERTICAL
var MenuFramesVertical=1; // Frames in cols or rows 1 or 0
var DissapearDelay=1000; // delay before menu folds in
var TakeOverBgColor=1; // Menu frame takes over background color subitem frame
var FirstLineFrame='navig'; // Frame where first level appears
var SecLineFrame='space'; // Frame where sub levels appear
var DocTargetFrame='space'; // Frame where target documents appear
var TargetLoc=''; // span id for relative positioning
var HideTop=0; // Hide first level when loading new document 1 or 0
var MenuWrap=1; // enables/ disables menu wrap 1 or 0
var RightToLeft=0; // enables/ disables right to left unfold 1 or 0
var UnfoldsOnClick=0; // Level 1 unfolds onclick/ onmouseover
var WebMasterCheck=0; // menu tree checking on or off 1 or 0
var ShowArrow=1; // Uses arrow gifs when 1
var KeepHilite=1; // Keep selected path highligthed
var Arrws=['tri.gif',5,10,'tridown.gif',10,5,'trileft.gif',5,10]; // Arrow source, width and height

function BeforeStart(){return}
function AfterBuild(){return}
function BeforeFirstOpen(){return}
function AfterCloseAll(){return}


// Menu tree
// MenuX=new Array(Text to show, Link, background image (optional), number of sub elements, height, width);
// For rollover images set "Text to show" to: "rollover:Image1.jpg:Image2.jpg"

Menu1=new Array("Page 1","page1.cfm","",0,20,120);Menu2=new Array("Page 2","page2.cfm ","",0,20,150);Menu3=new Array("No Page"," ","",0,20,220);Menu4=new Array("No Page","","",0,20,140);Menu5=new Array("No Page","","",0,20,52);


Arie

aawan
01-08-2008, 03:40 PM
Arie,

Thank you so much for your help.
Can you tell me what it was that you fixed?

Also, I thought the menu will just appear anywhere that I have a div with the id of "MenuPos".
However the menu seems independent of that, and so I had this grey bar that was out of
line with the menu.

Anyway, thanks again. I appreciate you taking the time to help.

Ali

molendijk
01-08-2008, 04:31 PM
Hello Ali,
I was just guessing that your menu_var.js caused the problem, so I downloaded a new one from DD and put your menu in it (with some styles). That fixed the problem. As for the menu position, that should be handled in the menu itself. You can give values for StartTop and StartLeft there. If you want to use percentages, you have to do something like StartLeft=screen.width*0.1; StartTop=screen.height*0.2, whatever you want.

Good luck,
Arie.