26. september 2002 - 09:21
Der er
8 kommentarer
Hvorfor opstår der fejl på siden?
Hej! Jeg er i gang med at lave en menu med et script jeg har 'lånt' fra et spørgsmål her på eksperten :0P - men explorer bliver ved med at påstå at der er fejl på siden - hvorfor? På forhånd mange tak :0) <head> <script language="javascript" src="ypslideoutmenusc.js"></script> <script language="javascript"> var menus = [ new ypSlideOutMenu("menu1", "right", 59, 80, 100, 0), new ypSlideOutMenu("menu2", "right", 59, 80, 100, 0), ] for (var i = 0; i < menus.length; i++) { menus[i].onactivate = new Function("document.getElementById('act" + i + "').className='active';"); menus[i].ondeactivate = new Function("document.getElementById('act" + i + "').className='';"); } </script> <link rel="stylesheet" href="menu.css" type="text/css"> </head> <body> <!-- menu bjælke uden grafik --> <div id="menubar" class="menu"> <a id="act0" href="#" onmouseover="ypSlideOutMenu.showMenu('menu1')" onmouseout="ypSlideOutMenu.hideMenu('menu1')" >MenuOverskrift1</a> <a id="act1" href="#" onmouseover="ypSlideOutMenu.showMenu('menu2')" onmouseout="ypSlideOutMenu.hideMenu('menu2')" >MenuOverskrift2</a> </div> <!-- slut menu bjælke --> <!-- menu bjælke med grafik --> <div id="menubar"> <a id="act0" href="#" onmouseover="ypSlideOutMenu.showMenu('menu1') ; MM_swapImage('imgNavnMenu1','','boxover.gif',1)" onmouseout="ypSlideOutMenu.hideMenu('menu1') ; MM_swapImgRestore()"> <img name="imgNavnMenu1" src="box.gif" class="imgmenu"> </a> <a id="act2" href="#" onmouseover="ypSlideOutMenu.showMenu('menu2') ; MM_swapImage('imgNavnMenu2','','boxover.gif',1)" onmouseout="ypSlideOutMenu.hideMenu('menu2') ; MM_swapImgRestore()"> <img name="imgNavnMenu2" src="box.gif" class="imgmenu2"> </a> </div> <!-- slut menu med grafik --> <!-- bygger menu1 --> <!- uden grafik --> <div id="menu1Container" class="menu"> <div id="menu1Content" class="menu"> <div class="options"> dhtml </div> </div> </div> <div id="menu2Container" class="menu"> <div id="menu2Content" class="menu"> <div class="options2"> dhtml </div> </div> </div> <!slut uden grafik --> <div class="hide"></div> </body> </html>
Annonceindlæg tema
Cloud & AI
I dette særtema ser vi på, hvordan cloud og AI bliver fundamentet for virksomhedernes digitale forretning, og hvordan de nye muligheder for automatisering og forretningsværdi kan udnyttes uden at miste overblik, sikkerhed og menneskelig kontrol.
26. september 2002 - 09:26
#1
De er fordi der er fejl på siden :) det er lidt svært at sige hvor da din kode er gemt væk i <script language="javascript" src="ypslideoutmenusc.js"></script> og dine styles er gemt væk i <link rel="stylesheet" href="menu.css" type="text/css"> mvh JakobA
26. september 2002 - 09:27
#2
Det er fordi du har en ældre version end IE 5.0. De understøtter nemlig ikke document.getElementById() ;o) //>Rune
26. september 2002 - 09:51
#3
hmm oki. men det hele virker nu som det skal. så jeg brokker mig ik :0) det ser bare dumt ud at der står "hey smarte kan du ik finde ud af det? ha ha ha..." i bunden af explorer.... men oki, stylesheet er her: .menu { position : absolute; top : 100px; left: 100px; } .menubar { position : absolute; top : 100px; left: 100px; } .options { position : absolute; top : 30px; left: 0px; border : 1px solid Black; background : #568AEB; width : 100px; height: 20 px; z-index: 0; font-size : 10px; font-family : Verdana; letter-spacing : 1px; font-weight : bold; text-align : center; padding-top : 3px; } .imgmenu { border : 0px solid White; position: absolute; left: 40px; top: 140 px; z-index: 1; } .options2 { position : absolute; top : 49px; left: 0px; border : 1px solid Black; background : #DEBE41; width : 100px; height: 20 px; z-index: 0; font-size : 10px; font-family : Verdana; letter-spacing : 1px; font-weight : bold; text-align : center; padding-top : 3px; } .options3 { position : absolute; top : 68px; left: 0px; border : 1px solid Black; background : #DEBE41; width : 100px; height: 20 px; z-index: 0; font-size : 10px; font-family : Verdana; letter-spacing : 1px; font-weight : bold; text-align : center; padding-top : 3px; } .imgmenu2 { border : 0px solid White; position: absolute; left: 40px; top: 159 px; z-index: 1; } .imgmenu3 { border : 0px solid White; position: absolute; left: 40px; top: 178 px; z-index: 1; } .hide { position: absolute; left:0px; top: 140 px; background-color: white; width: 40px; height: 80px; border: 0px white solid; z-index: 1; } ------------------------------------------------- og ypslideoutmenusc.js er her : /***************************************************** * ypSlideOutMenu * 3/04/2001 * * a nice little script to create exclusive, slide-out * menus for ns4, ns6, mozilla, opera, ie4, ie5 on * mac and win32. I've got no linux or unix to test on but * it should(?) work... * * --youngpup-- *****************************************************/ ypSlideOutMenu.Registry = [] ypSlideOutMenu.aniLen = 250 ypSlideOutMenu.hideDelay = 300 ypSlideOutMenu.minCPUResolution = 10 function ypSlideOutMenu(id, dir, left, top, width, height) { this.ie = document.all ? 1 : 0 this.ns4 = document.layers ? 1 : 0 this.dom = document.getElementById ? 1 : 0 if (this.ie || this.ns4 || this.dom) { this.id = id this.dir = dir this.orientation = dir == "left" || dir == "right" ? "h" : "v" this.dirType = dir == "right" || dir == "down" ? "-" : "+" this.dim = this.orientation == "h" ? width : height this.hideTimer = false this.aniTimer = false this.open = false this.over = false this.startTime = 0 this.gRef = "ypSlideOutMenu_"+id eval(this.gRef+"=this") ypSlideOutMenu.Registry[id] = this var d = document d.write('<style type="text/css">') d.write('#' + this.id + 'Container { visibility:hidden; ') d.write('left:' + left + 'px; ') //d.write('top:' + top + 'px; ') d.write('top:10px; ') //d.write('overflow:hidden; }') d.write('}') //d.write('#' + this.id + 'Container, #' + this.id + 'Content { position:absolute; ') d.write('#' + this.id + 'Container, #' + this.id + 'Content { position:absolute; ') //d.write('width:' + width + 'px; ') //d.write('height:' + height + 'px; ') //d.write('clip:rect(0 ' + width + ' ' + height + ' 0); ') d.write('}') d.write('</style>') this.load() } } ypSlideOutMenu.prototype.load = function() { var d = document var lyrId1 = this.id + "Container" var lyrId2 = this.id + "Content" var obj1 = this.dom ? d.getElementById(lyrId1) : this.ie ? d.all[lyrId1] : d.layers[lyrId1] if (obj1) var obj2 = this.ns4 ? obj1.layers[lyrId2] : this.ie ? d.all[lyrId2] : d.getElementById(lyrId2) var temp if (!obj1 || !obj2) window.setTimeout(this.gRef + ".load()", 100) else { this.container = obj1 this.menu = obj2 this.style = this.ns4 ? this.menu : this.menu.style this.homePos = eval("0" + this.dirType + this.dim) this.outPos = 0 this.accelConst = (this.outPos - this.homePos) / ypSlideOutMenu.aniLen / ypSlideOutMenu.aniLen if (this.ns4) this.menu.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT); this.menu.onmouseover = new Function("ypSlideOutMenu.showMenu('" + this.id + "')") this.menu.onmouseout = new Function("ypSlideOutMenu.hideMenu('" + this.id + "')") this.endSlide() } } ypSlideOutMenu.showMenu = function(id) { var reg = ypSlideOutMenu.Registry var obj = ypSlideOutMenu.Registry[id] if (obj.container) { obj.over = true for (menu in reg) if (id != menu) ypSlideOutMenu.hide(menu) if (obj.hideTimer) { reg[id].hideTimer = window.clearTimeout(reg[id].hideTimer) } if (!obj.open && !obj.aniTimer) reg[id].startSlide(true) } } ypSlideOutMenu.hideMenu = function(id) { var obj = ypSlideOutMenu.Registry[id] if (obj.container) { if (obj.hideTimer) window.clearTimeout(obj.hideTimer) obj.hideTimer = window.setTimeout("ypSlideOutMenu.hide('" + id + "')", ypSlideOutMenu.hideDelay); } } ypSlideOutMenu.hide = function(id) { var obj = ypSlideOutMenu.Registry[id] obj.over = false if (obj.hideTimer) window.clearTimeout(obj.hideTimer) obj.hideTimer = 0 if (obj.open && !obj.aniTimer) obj.startSlide(false) } ypSlideOutMenu.prototype.startSlide = function(open) { this[open ? "onactivate" : "ondeactivate"]() this.open = open if (open) this.setVisibility(true) this.startTime = (new Date()).getTime() this.aniTimer = window.setInterval(this.gRef + ".slide()", ypSlideOutMenu.minCPUResolution) } ypSlideOutMenu.prototype.slide = function() { var elapsed = (new Date()).getTime() - this.startTime if (elapsed > ypSlideOutMenu.aniLen) this.endSlide() else { var d = Math.round(Math.pow(ypSlideOutMenu.aniLen-elapsed, 2) * this.accelConst) if (this.open && this.dirType == "-") d = -d else if (this.open && this.dirType == "+") d = -d else if (!this.open && this.dirType == "-") d = -this.dim + d else d = this.dim + d this.moveTo(d) } } ypSlideOutMenu.prototype.endSlide = function() { this.aniTimer = window.clearTimeout(this.aniTimer) this.moveTo(this.open ? this.outPos : this.homePos) if (!this.open) this.setVisibility(false) if ((this.open && !this.over) || (!this.open && this.over)) { this.startSlide(this.over) } } ypSlideOutMenu.prototype.setVisibility = function(bShow) { var s = this.ns4 ? this.container : this.container.style s.visibility = bShow ? "visible" : "hidden" } ypSlideOutMenu.prototype.moveTo = function(p) { this.style[this.orientation == "h" ? "left" : "top"] = this.ns4 ? p : p + "px" } ypSlideOutMenu.prototype.getPos = function(c) { return parseInt(this.style[c]) } ypSlideOutMenu.prototype.onactivate = function() { } ypSlideOutMenu.prototype.ondeactivate = function() { } ------------------------------------------------------------- hvis i såehn lige har et par timer :0)
26. september 2002 - 09:55
#4
Jeg ved godt stylesheet og dets funktioner er lidt klodset lavet, men det skal der nok blive lavet om på senere :0)
Lige en ting til: er der mon en der for det dobbelte beløb kunne fortælle mig hvordan man får menuen til at "spawne" ud i flere menuer som på
http://aveda.com/home.asp??
26. september 2002 - 10:13
#5
medions >> jeg kører med 5.0!!! :0D
26. september 2002 - 13:24
#6
60 point oveni..anyone?
Slettet bruger
28. september 2002 - 11:56
#7
Slettet bruger
28. september 2002 - 11:57
#8
Den har også en slide-funktion.
Vi tilbyder markedets bedste kurser inden for webudvikling