[JS] Layer van menu op zelfde plaats laten staan dmv check

[BacardiBreezer]

Ik heb hier een javascript menu gebouwd dat moet functioneren met layers. Je hebt een hoofdmenu layer en een sybmenulayer(s).

De hoogte waar het menu staat is altijd hetzelfde, dat zal ook niet kunnen wijzigen. De breedte echter doormiddel van de screensize. Nu hbe ik hier wat topics gelezen over hoe dit op te lossen en er kwam een idee bij me op.

Is het niet handiger om browsercheck te doen bij het laden van de pagina en dan de bijbehorende CSS daarbij te pakken ?

Het probleem waar je natuurlijk mee blijft zitten is resizen van je browser op dat moment mag ik aannemen ?

Damn.... why always the hard way

[disjfa]

Ligt eraan wat je precies wilt. Je zou ook kunnen beginnen met wat code posten

Vaak hoef je niet zoveel browsercheck te doen omdat de meeste browsers tegenwoordig normaal met js om kunnen gaan

[BacardiBreezer]

disjfa schreef op 09 juni 2004 @ 17:33:
Ligt eraan wat je precies wilt. Je zou ook kunnen beginnen met wat code posten

Vaak hoef je niet zoveel browsercheck te doen omdat de meeste browsers tegenwoordig normaal met js om kunnen gaan

Nou het code verhaal is opzich niet zo'n probleem..... alleen het plaatsen van de layers (in mijn geval horizontaal) is lastig dus zou ik de waarden aan kunnen laten passen van de positie doormiddel van die browsercheck en dan de juiste CSS laten laden.

Er zijn meerdere mensen met dit probleem heb ik al begrepen.....

[BacardiBreezer]

Ik heb wat code gevonden en wel dit:

var isNav, isIE
var coll=""
var styleObj=""

if (parseInt(navigator.appVersion) >=4) {
if (navigator.appName == "Netscape") {
isNav = true
} else {
isIE = true
coll = "all."
styleObj = ".style"
}
}

//deze functie geeft de hoogte van het object terug in pixels

function getObjHeight(obj) {
if (isNav) {
return obj.clip.height
} else {
return obj.clientHeight
}
}

//hetzelde maar dan de breedte

function getObjWidth(obj) {
if (isNav) {
return obj.clip.width
} else {
return obj.clientWidth
}
}

//deze functie geeft de beschikbare breedte vab het browservenster terug..

function getInsideWindowWidth() {
if (isNav) {
return window.innerWidth
} else {
return document.body.clientWidth
}
}

//de hoogte van het venster..

function getInsideWindowHeight() {
if (isNav) {
return window.innerHeight
} else {
return document.body.clientHeight
}
}

//het verplaatsen van het object...

function shiftTo(obj, x, y) {
if (isNav) {
obj.moveTo(x,y)
} else {
obj.pixelLeft = x
obj.pixelTop = y
}
}

//Wat mulo wiskunde om het midden (de nieuwe x en y posities) te berekenen...De ID van de DIV is hier "card"..

function centerIt() {
var obj = eval("document." + coll + "card" + styleObj)
var contentObj = eval("document." + coll + "card")
var x = Math.round((getInsideWindowWidth()/2)-(getObjWidth(contentObj)/2))
var y = Math.round((getInsideWindowHeight()/2)-(getObjHeight(contentObj)/2))
shiftTo(obj, x, y)
obj.visibility = "visible"
}

//Het Netscape probleem met gepositioneerde elementen opgelost...

function handleResize() {
if (isNav) {
location.reload()
} else {
centerIt()
}
}


Dit werkt super moet ik eerlijk zeggen, de ID geef je gewoon mee en hopsa het is geregeld. Nu zit ik alleen met het probleem dat mijn layer onderdeel is van een DHTML-menu en ik de ID's dus al weggegeven heb. Ik zie geen mogelijkheid deze functie mee te geven in de ID die hij nu al krijgt, is er geen mogelijkheid tot dubbele ID's ? Lijkt me niet maar anders heb ik een probleem denk ik.

[ Voor 5% gewijzigd door BacardiBreezer op 10-06-2004 15:00 ]