Closed Thread Icon

Preserved Topic: Layer Question Pages that link to <a href="https://ozoneasylum.com/backlink?for=18437" title="Pages that link to Preserved Topic: Layer Question" rel="nofollow" >Preserved Topic: Layer Question\

 
Author Thread
Ducati
Paranoid (IV) Inmate

From: in your head
Insane since: Feb 2001

posted posted 03-03-2002 00:06

Is there a way to have a layer show from "hide/show" in the middle of the browser window and have it follow the window on resize???

I have few layers as "links" but the problem is when I show them they stay in the same spot when I resize my browser which causes scrollbar madness!!!!!!! The whole desing is nice and liquid and works great with Netscape (pppfffuuu) but those damn layers just mess it all up. They stay on the same spot!!!!!!!!1

How can I make them "follow"

Ducati
Paranoid (IV) Inmate

From: in your head
Insane since: Feb 2001

posted posted 03-03-2002 03:19

Anyone? Hello?

See... and then you ask me why I post everything in Ozones forum...

CPrompt
Maniac (V) Inmate

From: there...no..there.....
Insane since: May 2001

posted posted 03-03-2002 03:56

Damn dude you gotta give me more than 3hrs to respond. I had to go to the grocery store, we had no food!

Anyway. . .

Do you mean to keep them centered vertically? If so then check out this topic. It will help you out with that.

Can you give me a link to a page to see?



Later,
C:\


~Binary is best~

Ducati
Paranoid (IV) Inmate

From: in your head
Insane since: Feb 2001

posted posted 03-03-2002 20:18

hehehe sorry... I am impatient..

here is the link www.studiosone.com/layers

click on the link and you see what I am talking about... it looks good at 1280 by 1024 full screen but when you resize everything goes haywire...

DocOzone
Maniac (V) Lord Mad Scientist
Sovereign of all the lands Ozone and just beyond that little green line over there...

From: Stockholm, Sweden
Insane since: Mar 1994

posted posted 03-04-2002 01:10

Hmm, I do stuff like this all the time now, it sounds like you need a simplified version of what I'm using on my front page right now. From what I can see, you'd probably want the width of the window (or the top/left corner) to be adjusted automatically as the window resizes, or at least at the "onresize" event. Let's see if I could hack you up a quick script for this, hmm?

<script language="Javascript">
<--
// we'll start with a short version of the Zbrowse script,
// so we can get the width of the screen when needed.
function makeZbrowse() { this.id = "Zbrowse";}
makeZbrowse.prototype.width = function() {
return Zflag.IE?document.body.clientWidth:window.innerWidth;}
makeZbrowse.prototype.height = function() {
return Zflag.IE?document.body.clientHeight:window.innerHeight;}
Zbrowse = new makeZbrowse();

// then we need a function that fires "onresize"
onresize = moveWin;

// you'll probably have some values already?
whereWinTop = 200;
whereWinLeft = 200;
floatWindowWidth = 400;
floatWindowHeight = 200;

// the function itself...
function moveMe() {
// this will center a 400px wide floating <div> named "floatWin"
if (document.layers) {
document.floatWin.left = Math.round((Zbrowse.width()-floatWindowWidth)/2);
document.floatWin.top = Math.round((Zbrowse.height()-floatWindowHeight)/2);
}
if (document.getElementById ){
document.getElementById('floatWin').style.left = Math.round((Zbrowse.width()-floatWindowWidth)/2);
document.getElementById('floatWin').style.top = Math.round((Zbrowse.height()-floatWindowHeight)/2);
}
}
//-->
</script>

And that would center a 400x200 pixel window smack dab in the middle of the screen, and it would fix itself when the window resized. Opera doesn't do the onResize event, but you can check once after the page is loaded and set variables for the current height/width of the browser, and then compare it on a setInterval(), maybe every second or so. You can probably do bunches of other things with this, play around, have fun!

Your pal, -doc-

Ducati
Paranoid (IV) Inmate

From: in your head
Insane since: Feb 2001

posted posted 03-04-2002 10:14

boy.. this is complicated...

I can't figure this darn thing out....

The layer size is 730 by 295.

Do I just copy this code in Doc? Sorry to sound stupid but I am lost with this.. I would really like to get this effect going. I like the idea of layers but this java thing is just way to advanced for me....

DocOzone
Maniac (V) Lord Mad Scientist
Sovereign of all the lands Ozone and just beyond that little green line over there...

From: Stockholm, Sweden
Insane since: Mar 1994

posted posted 03-04-2002 10:44

Yah, you should be able to just copy in this code, changing these two lines...

floatWindowWidth = 730;
floatWindowHeight = 295;

And these lines....

if (document.layers) {
document.floatWin.left = Math.round((Zbrowse.width()-floatWindowWidth)/2);
document.floatWin.top = Math.round((Zbrowse.height()-floatWindowHeight)/2);
}
if (document.getElementById ){
document.getElementById('floatWin').style.left = Math.round((Zbrowse.width()-floatWindowWidth)/2);
document.getElementById('floatWin').style.top = Math.round((Zbrowse.height()-floatWindowHeight)/2);
}

Which put the box dead center in the browser window. You may want to top to stay the same in which case you could just comment out the ..top lines, and the left definition "Math.round((Zbrowse.width()-floatWindowWidth)/2);" is the exact center. You may want it just off of the left edge? This would do that math...

Zbrowse.width()-floatWindowWidth - 16; // this would put it 16px off of the right side.

Plug it in, see what happens! You can't break anything too badly.

Your pal, -doc-

Ducati
Paranoid (IV) Inmate

From: in your head
Insane since: Feb 2001

posted posted 03-04-2002 12:04

no go Doc

Maybe I should stay away from layers and do popups or chromless window or something like that....

look at the code, maybe I screwed it all up..
www.studiosone.com/layers

DocOzone
Maniac (V) Lord Mad Scientist
Sovereign of all the lands Ozone and just beyond that little green line over there...

From: Stockholm, Sweden
Insane since: Mar 1994

posted posted 03-05-2002 07:47

OK, you've got all these <div>'s, named things like "about" and "contact" etc... so you're going to need to center them all, or place them inside another <div> and center that one. Try just replacing "floatWin" with the names of one of your divs, and see if that one centers as it should. (Possibly also call the "moveMe()" script when you call the MM_showHideLayers() too.) I could give you a full script to do all of them at once, do you want me to do that, or do you want to try and tackle this yourself? (You're awfully close right now.)

Your pal, -doc-

Ducati
Paranoid (IV) Inmate

From: in your head
Insane since: Feb 2001

posted posted 03-05-2002 10:16

Well.. let me play with it myself.. I would like to learn it and this would be a great experience for me...

I thought I would have to put them in nested layers.

Let me play with it and if I have any problems I will shoot you email cool???

:: m a x ::

DocOzone
Maniac (V) Lord Mad Scientist
Sovereign of all the lands Ozone and just beyond that little green line over there...

From: Stockholm, Sweden
Insane since: Mar 1994

posted posted 03-05-2002 20:11

You got it, no problem. I'd try just nesting all the divs in one main div first, and then centering that one. (all the others would then have the top and left set to '0').

Your pal, -doc-

Quarath
Bipolar (III) Inmate

From: Magna, UT
Insane since: May 2000

posted posted 03-16-2002 23:09

Doc,

What do you change to make it adjust vertically only like you island image?

See this:

http://www.ozoneasylum.com/Forum2/HTML/001471.html

« BackwardsOnwards »

Show Forum Drop Down Menu