Breadcrumb Coolmenus placering
Jeg skal have vist en breadcrumb i <div id="stifinder"> således at makeCM.prototype.onconstruct='this.listpos(nowrite,self)' altid kommer det rette sted.Hvordan placeres denne - se funktionen function placeElements()
Her er den ellers velfungerende kode fra Thomas B.:
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<html>
<head>
<title>Coolmenus example - CoolMenus4 DHTML script made by Thomas Brattli from DHTMLCentral.com. Visit for more great scripts.</title>
<style>
/* CoolMenus 4 - default styles - do not edit */
.clCMEvent{position:absolute; width:99%; height:99%; clip:rect(0,100%,100%,0); left:0; top:0; visibility:visible}
.clCMAbs{position:absolute; visibility:hidden; left:0; top:0}
/* CoolMenus 4 - default styles - end */
/*Style for the background-bar*/
.clBar{position:absolute; width:10; height:10; background-color:#0198E9; layer-background-color:#0198E9; visibility:hidden}
/*Styles for level 0*/
.clLevel0,.clLevel0over{position:absolute; padding:2px; font-family:tahoma,arial,helvetica; font-size:9px; font-weight:bold}
.clLevel0{background-color:#0198E9; layer-background-color:#0198E9; color:white;}
.clLevel0over{background-color:#0198E9; layer-background-color:#0198E9; color:black; cursor:pointer; cursor:hand; }
.clLevel0border{position:absolute; visibility:hidden; background-color:#0198E9; layer-background-color:#0198E9}
/*Listposstyle for your style sheet*/
.listposstyle,.listposstyle a{font-family:verdana;font-size:10px;text-decoration:none;font-weight:normal;color:navy;}
.listposstyle{position:absolute;padding:2px;background-color:#ffffff;layer-background-color:#336699;}
</style>
<script language="JavaScript1.2" src="menu/coolmenus4.js">
/*****************************************************************************
Copyright (c) 2001 Thomas Brattli (webmaster@dhtmlcentral.com)
DHTML coolMenus - Get it at coolmenus.dhtmlcentral.com
Version 4.0_beta
This script can be used freely as long as all copyright messages are
intact.
Extra info - Coolmenus reference/help - Extra links to help files ****
CSS help: http://192.168.1.31/projects/coolmenus/reference.asp?m=37
General: http://coolmenus.dhtmlcentral.com/reference.asp?m=35
Menu properties: http://coolmenus.dhtmlcentral.com/properties.asp?m=47
Level properties: http://coolmenus.dhtmlcentral.com/properties.asp?m=48
Background bar properties: http://coolmenus.dhtmlcentral.com/properties.asp?m=49
Item properties: http://coolmenus.dhtmlcentral.com/properties.asp?m=50
******************************************************************************/
</script>
</head>
<body marginwidth="0" marginheight="0">
<table width="100%" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top"><table width="790" border="1" cellspacing="0" cellpadding="0">
<tr bordercolor="#0198E9" bgcolor="#0198E9">
<td>
<table >
<tr>
<td >
<!-- MENU TD'S -->
<td width="20%" height="20">
<!-- You need all this START --- ITEM 0 -->
<ilayer id="layerMenu0">
<div id="divMenu0"> <img src="cm_fill.gif" width="6" height="15" alt="" border="0"> </div>
</ilayer>
<!-- END -->
</td>
<td width="20%" height="20">
<!-- You need all this START --- ITEM 1 -->
<ilayer id="layerMenu1">
<div id="divMenu1"> <img src="cm_fill.gif" width="6" height="15" alt="" border="0"> </div>
</ilayer>
<!-- END -->
</td>
<td width="20%" height="20">
<!-- You need all this START --- ITEM 2 -->
<ilayer id="layerMenu2">
<div id="divMenu2"> <img src="cm_fill.gif" width="6" height="15" alt="" border="0"> </div>
</ilayer>
<!-- END -->
</td>
<td width="20%" height="20">
<!-- You need all this START --- ITEM 3 -->
<ilayer id="layerMenu3">
<div id="divMenu3"> <img src="cm_fill.gif" width="6" height="15" alt="" border="0"> </div>
</ilayer>
<!-- END -->
</td>
<td width="20%" height="20">
<!-- You need all this START --- ITEM 4 -->
<ilayer id="layerMenu4">
<div id="divMenu4"> <img src="cm_fill.gif" width="6" height="15" alt="" border="0"> </div>
</ilayer>
<!-- END -->
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" colspan=""> This one is more complicated then the previous
because it tries to place all the top items in different TD's. <br>
We use a fill image inside the TD's to force the size of the TD to the
size of the menu. Then we try to find the position of the div/layer surrounding
the layer and then places the menu where that layer/div is. We place a
fill image inside the TD to force the height of the items to the same as
the height of the menuitems. <br>
<br>
For this to work the menucode have to be placed AFTER the table. Which
again means that it's VERY important that the code inside the table is
correct (correctly nested tags, close all P tags and so on), if not Netscape
4 WILL break. <br>
<br>
We set the width of the TD's and the top items to 20%. This technique can
also be used to place menus totally different places on the page. <br>
<br>
</td></tr><tr>
<td height="20">
<!-- You need all this START --- ITEM 3 -->
<ilayer id="stifinder">
<div id="stifinder"> <img src="cm_fill.gif" width="6" height="15" alt="" border="0"> </div>
</ilayer>
<!-- END -->
</td>
</tr>
</table></td>
</tr>
</table>
<script>
/***
This is the menu creation code - place it right after you body tag
Feel free to add this to a stand-alone js file and link it to your page.
**/
//Menu object creation
oCMenu=new makeCM("oCMenu") //Making the menu object. Argument: menuname
//Menu properties
oCMenu.pxBetween=1
oCMenu.fromLeft=5
oCMenu.fromTop=111
oCMenu.rows=1
oCMenu.menuPlacement="left"
oCMenu.offlineRoot="file:///C|/wwwerhverv/nyweb/menu/"
oCMenu.onlineRoot=""
oCMenu.resizeCheck=1
oCMenu.wait=1000
oCMenu.fillImg="menu/cm_fill.gif"
oCMenu.zIndex=0
//Background bar properties
oCMenu.useBar=0
//Level properties - ALL properties have to be spesified in level 0
oCMenu.level[0]=new cm_makeLevel() //Add this for each new level
oCMenu.level[0].width="150"
oCMenu.level[0].height=18
oCMenu.level[0].regClass="clLevel0"
oCMenu.level[0].overClass="clLevel0over"
oCMenu.level[0].borderX=1
oCMenu.level[0].borderY=1
oCMenu.level[0].borderClass="clLevel0border"
oCMenu.level[0].offsetX=0
oCMenu.level[0].offsetY=0
oCMenu.level[0].rows=0
oCMenu.level[0].arrow=0
oCMenu.level[0].arrowWidth=0
oCMenu.level[0].arrowHeight=0
oCMenu.level[0].align="bottom"
/**List position definition**/
oCMenu.listposx=oCMenu.fromLeft+214 //Det er denne som bestemmer x-akse placeringen af stifinderen
oCMenu.listposy=oCMenu.fromTop+200 //Det er denne som bestemmer y-akse placeringen af stifinderen
oCMenu.listposwidth=470 //px
oCMenu.listposheight=15 //px
oCMenu.listposclass="listposstyle"
oCMenu.listposmode=0 //0=use querystring or 1=use path
oCMenu.listpospath=1 //0=absolute or 1=relative
oCMenu.listposconst=0 //must be 0 all the time
oCMenu.listposhomelink="index.asp"; //nothing without homelink otherwise "http://www.ttt.com"
oCMenu.listposhomelinktarget="_top"; //nothing without homelink otherwise "http://www.ttt.com"
/******************************************
Menu item creation:
myCoolMenu.makeMenu(name, parent_name, text, link, target, width, height, regImage, overImage, regClass, overClass , align, rows, nolink, onclick, onmouseover, onmouseout)
*************************************/
oCMenu.makeMenu('m1','m1','Handelsskolen','han.asp?h=10&v=&v2=&id=1')
oCMenu.makeMenu('m70','m1','Kort om Handelsskolen','han.asp?h=10&v=1&v2=&id=70')
oCMenu.makeMenu('m80','m1','Beliggenhed HS','han_belig.asp?h=10&v=2&v2=12&id=80')
oCMenu.makeMenu('m90','m1','Udbud og kvalitet','han_abenhed.asp?h=10&v=3&v2=&id=90')
oCMenu.makeMenu('m100','m1','Personale','han_undervis.asp?h=10&v=4&v2=&id=100')
oCMenu.makeMenu('m110','m1','Se og hør mere om skolen','han_seoghor.asp?h=10&v=5&v2=&id=110')
oCMenu.makeMenu('m112','m1','Kontakt handelsskolen','han_kontakt.asp?h=10&v=6&v2=16&id=112')
oCMenu.makeMenu('m2','m2','Ungdomsuddannelser','ung_hg.asp?h=20&v=&v2=&id=2')
oCMenu.makeMenu('m130','m2','Handelsskolens Grunduddannelse','ung_hg.asp?h=20&v=8&v2=&id=130')
oCMenu.makeMenu('m160','m2','Højere Handelseksamen HH','ung_hh.asp?h=20&v=9&v2=&id=160')
oCMenu.makeMenu('m190','m2','Kontakt ungdomsuddannelserne','ung_kontakt.asp?h=20&v=16&v2=&id=190')
oCMenu.makeMenu('m194','m2','Frikvarter - billedkavalkade','ung_frikvarter.asp?h=20&v=18&v2=&id=194')
oCMenu.makeMenu('m3','m3','Sportscollege','sport.asp?h=30&v=&v2=&id=3')
oCMenu.makeMenu('m211','m3','Kort om Sportscollege','sport.asp?h=30&v=19&v2=&id=211')
oCMenu.makeMenu('m212','m3','Tilmelding til Sportscollege','sport_tilmeld.asp?h=30&v=19&v2=&id=212')
oCMenu.makeMenu('m213','m3','Kontakt Sportscollege','sport_kontakt.asp?h=30&v=19&v2=&id=213')
oCMenu.makeMenu('m214','m3','Beliggenhed Sportcollege','sport_belig.asp?h=30&v=19&v2=&id=214')
oCMenu.makeMenu('m4','m4','Kursusafdelingen','kur.asp?h=40&v=&v2=&id=4')
oCMenu.makeMenu('m221','m4','Kurser','kur_kurser.asp?h=40&v=20&v2=&id=221')
oCMenu.makeMenu('m222','m4','Tilmelding kurser','kur_tilmeld.asp?h=40&v=21&v2=&id=222')
oCMenu.makeMenu('m223','m4','Kontakt Kursusafdelingen','kur_kontakt.asp?h=40&v=21&v2=&id=223')
oCMenu.makeMenu('m224','m4','Beliggenhed Kursusafd.','kur_belig.asp?h=40&v=21&v2=&id=224')
oCMenu.makeMenu('m5','m5','Kontakt os','kon.asp?h=50&v=&v2=&id=5')
oCMenu.makeMenu('m231','m5','Kontakt handelsskolen','kon.asp?h=50&v=22&v2=&id=231')
oCMenu.makeMenu('m232','m5','Persondataloven','kon_person.asp?h=50&v=22&v2=&id=232')
oCMenu.makeMenu('m233','m5','Privatlivspolitik','kon_privatliv.asp?h=50&v=23&v2=&id=233')
oCMenu.makeMenu('m234','m5','Hjælpesiden','kon_hjaelp.asp?h=50&v=26&v2=&id=234')
oCMenu.makeMenu('m235','m5','Sitemap/oversigt','kon_sitemap.asp?h=50&v=24&v2=&id=235')
//Leave this line - it constructs the menu
makeCM.prototype.onconstruct='this.listpos(nowrite,self)' //denne skal anbringes i div ID=stifinder!!!!!
oCMenu.construct()
//Extra code to find position:
function findPos(num){
//alert(num)
if(bw.ns4){ //Netscape 4
x = document.layers["layerMenu"+num].pageX
y = document.layers["layerMenu"+num].pageY
}else{ //other browsers
x=0; y=0; var el,temp
el = bw.ie4?document.all["divMenu"+num]:document.getElementById("divMenu"+num);
if(el.offsetParent){
temp = el
while(temp.offsetParent){ //Looping parent elements to get the offset of them as well
temp=temp.offsetParent;
x+=temp.offsetLeft
y+=temp.offsetTop;
}
}
x+=el.offsetLeft
y+=el.offsetTop
}
//Returning the x and y as an array
return [x,y]
}
function placeElements(){
//Changing the position of ALL top items:
pos = findPos(0)
oCMenu.m["m1"].b.moveIt(pos[0]+1,pos[1]+1)
pos = findPos(1)
oCMenu.m["m2"].b.moveIt(pos[0]+1,pos[1]+1)
pos = findPos(2)
oCMenu.m["m3"].b.moveIt(pos[0]+1,pos[1]+1)
pos = findPos(3)
oCMenu.m["m4"].b.moveIt(pos[0]+1,pos[1]+1)
pos = findPos(4)
oCMenu.m["m5"].b.moveIt(pos[0]+1,pos[1]+1)
//Setting the fromtop value
oCMenu.fromTop = pos[1]
}
placeElements()
//Setting it to re place the elements after resize - the resize is not perfect though..
oCMenu.onafterresize="placeElements()"
</script>
</body>
</html>
Hvad gør jeg???
