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 fra GlobalConnect
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