27. juni 2001 - 09:39
Der er
10 kommentarer og 1 løsning
Centrering af layer
Jeg vil gerne kunne centrere mit layer på skærmen når det åbnes via en link. How...?
Annonceindlæg fra Infor
lag.left = (skærmens bredde/2)-lagets bredde; /Geeeet
Men hvor definerer jeg det. Jeg har mit open layer script... function show(id) { //HideAll(); if (ns) document.layers[id].visibility = \"show\"; else if (ie) document.all[id].style.visibility = \"visible\"; } ---------- Og her er mit layer <Div style=\"position:relative; .....
fx. sådan her: <div id=\"Layer1\" style=\"position:absolute; left:33%; top:33%; width:91px; height:85px; z-index:1\"></div>
et eksempel direkte fra dreamveawer: <html> <head> <title>Untitled Document</title> <meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-1\"> <script language=\"JavaScript\"> <!-- <!-- function MM_reloadPage(init) { //reloads the window if Nav4 resized if (init==true) with (navigator) {if ((appName==\"Netscape\")&&(parseInt(appVersion)==4)) { document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }} else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload(); } MM_reloadPage(true); // --> function MM_findObj(n, d) { //v4.0 var p,i,x; if(!d) d=document; if((p=n.indexOf(\"?\"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && document.getElementById) x=document.getElementById(n); return x; } function BW_reload() {location.reload();} function BW_centerLayers() { //v4.1.1 if (document.layers || document.all || document.getElementById){ var winWidth, winHeight, i, horz, vert, width, height, offsetX, offsetY, negX, negY, group, x, y, args; args = BW_centerLayers.arguments; onresize = BW_reload; winWidth = (document.all)?document.body.clientWidth:window.innerWidth; winHeight = (document.all)?document.body.clientHeight:window.innerHeight; for (i=0; i<(args.length-9); i+=10) { horz = args[i+1]; vert = args[i+2]; width = parseInt(args[i+3]); height = parseInt(args[i+4]); offsetX = parseInt(args[i+5]); offsetY = parseInt(args[i+6]); negX = args[i+7]; negY = args[i+8]; x = ((winWidth - width)/2) + offsetX; y = ((winHeight - height)/2) + offsetY; x = (negX==\'false\' && (x < 0))?0:x; y = (negY==\'false\' && (y < 0))?0:y; layerObj = (document.getElementById)?document.getElementById(args[i]):MM_findObj(args[i]); if (layerObj!=null) { layerObj = (layerObj.style)?layerObj.style:layerObj; layerObj.left = (horz==\"true\")?x:layerObj.left; layerObj.top = (vert==\"true\")?y:layerObj.top; } } } } //--> </script> </head> <body bgcolor=\"#FFFFFF\" text=\"#000000\"> <div id=\"Layer1\" style=\"position:absolute; width:200px; height:115px; z-index:1\" onClick=\"BW_centerLayers(\'Layer1\',\'true\',\'true\',\'200\',\'115\',\'0\',\'0\',\'false\',\'false\',\'false\')\"></div> </body> </html>
<ole> En lidt mere \'sexy\' version direkte fra NotePad: <html> <head> <script language=\"JavaScript\"> ns4 = (document.layers) ? true : false; ie4 = (document.all) ? true : false; dom = (document.getElementById) ? true : false; function show(id) { obj = (ns4)? document.layers[id] : (ie4)? document.all[id] : document.getElementById(id); styleObj = (ns4)? obj : obj.style; styleObj.left = (ns4)? (window.innerWidth-obj.clip.width)/2 : (document.body.offsetWidth-obj.offsetWidth)/2 styleObj.top = (ns4)? (window.innerHeight-obj.clip.height)/2 : (document.body.offsetHeight-obj.offsetHeight)/2 styleObj.visibility = \"visible\"; } </script> </head> <body> <div id=\"bla\" style=\"position:absolute;visibility:hidden;\">her står noget</div> <a href=\"#\" onclick=\"show(\'bla\');\">Vis</a> </body> </html> /mvh </bole>
Du gemmer med: function hide(id) { obj = (ns4)? document.layers[id] : (ie4)? document.all[id] : document.getElementById(id); styleObj = (ns4)? obj : obj.style; styleObj.visibility = \"hidden\"; } /mvh
Den var fandeme sexy, takker
En lille ekstra. Hvis jeg nu ønsker at lukke alle aktive lag før jeg åbner det nye... Hvad kommer så ind før dette. ---------------------------- function show(id) { obj = (ns4)? document.layers[id] : (ie4)? document.all[id] : document.getElementById(id); styleObj = (ns4)? obj : obj.style; styleObj.left = (ns4)? (window.innerWidth-obj.clip.width)/2 : (document.body.offsetWidth-obj.offsetWidth)/2 styleObj.top = (ns4)? (window.innerHeight-obj.clip.height)/2 : (document.body.offsetHeight-obj.offsetHeight)/2 styleObj.visibility = \"visible\"; }
Kalde dine lag bla0, bla1, bla2, osv. Sæt derefter en variabel til antallet af lag og lav en \'gemAlle\' funktion: var numLayers = 3; function hideAll() { for (i=0; i<numLayers; i++) { hide(\'bla\'+i); } } function show(id) { hideAll(); obj = (ns4)? document.layers[id] : (ie4)? document.all[id] : document.getElementById(id); styleObj = (ns4)? obj : obj.style; styleObj.left = (ns4)? (window.innerWidth-obj.clip.width)/2 : (document.body.offsetWidth-obj.offsetWidth)/2 styleObj.top = (ns4)? (window.innerHeight-obj.clip.height)/2 : (document.body.offsetHeight-obj.offsetHeight)/2 styleObj.visibility = \"visible\"; }
27. juni 2001 - 10:56
#10
takker
27. juni 2001 - 10:58
#11
Personligt synes jeg iøvrigt, det ser pænere ud, hvis du dividerer med 3 i stedet for 2, når du sætter \'top\' på laget - i show() funktionen. Eller du kan dele den overskydende luft op med en tilnærmelse af Det Gyldne Snit ved at dele med 8 og gange med 3: styleObj.top = (ns4)? ((window.innerHeight-obj.clip.height)/8)*3 : ((document.body.offsetHeight-obj.offsetHeight)/8)*3 Tak for points :o)
Vi tilbyder markedets bedste kurser inden for webudvikling