AndyBeckwith
asked on
centered layer
Alright, here is what I have:
A centered, NavBar, and I have pop-up menus for some of the buttons, these are done with a "show layer" behavior. The min_menu layer's position is absolute unless otherwise told- this is a problem since resizing the window will "mess-up" its position in relation to the newly centered NavBar.
My solution? write a javascript function to give the layer its position in this line:
<div id="Layer1" style="position:absolute; left:123px; top:149px; width:468px; height:30px; z-index:1">
The parameter I am concerned with is "left:123px;" Where 123 is, I would like to call the function.
I named the script:
function Find_horizontalPosition(po
// horizontally centered, that is...
How should I write the script and call the function? Coding ideas welcome...
A centered, NavBar, and I have pop-up menus for some of the buttons, these are done with a "show layer" behavior. The min_menu layer's position is absolute unless otherwise told- this is a problem since resizing the window will "mess-up" its position in relation to the newly centered NavBar.
My solution? write a javascript function to give the layer its position in this line:
<div id="Layer1" style="position:absolute; left:123px; top:149px; width:468px; height:30px; z-index:1">
The parameter I am concerned with is "left:123px;" Where 123 is, I would like to call the function.
I named the script:
function Find_horizontalPosition(po
// horizontally centered, that is...
How should I write the script and call the function? Coding ideas welcome...
ASKER
Only I am not looking for something that will work on resize... I want the initial position to be calculated as well. The layer should always be centered. The Dimensions of the layer are 468px by 30px- Obviously, the 468 is the part we're concerned with.
You want it centered? Like:
function ch_pos()
{
max_width = (n)?document.innerWidth:do
Obj = (n)?document.layers["Layer
l_width = Obj.width;
Obj.left = (max_width - l_width)/2;
}
function ch_pos()
{
max_width = (n)?document.innerWidth:do
Obj = (n)?document.layers["Layer
l_width = Obj.width;
Obj.left = (max_width - l_width)/2;
}
ASKER
right... l_width is the width of my layer, correct?
So how do I pass the width to the function? ...and then back to that original line?
<div id="Layer1" style="position:absolute; left:123px; top:149px; width:468px; height:30px; z-index:1">
(in the "left:123px" part... this is where I want to call the function from)
.... what does "ch"_pos stand for...
So how do I pass the width to the function? ...and then back to that original line?
<div id="Layer1" style="position:absolute; left:123px; top:149px; width:468px; height:30px; z-index:1">
(in the "left:123px" part... this is where I want to call the function from)
.... what does "ch"_pos stand for...
Okay some information
ch_pos is a function which, in general, looks for the current document width (NS and IE) and put the calculated left into the layer.
max_width contains the current document-width.
Then it gts a reference to the layer called Layer1 (case sensitive!!). Also for both IE and NS. Then it gets the current width of that one layer. Which will be stored in l_width. To center the layer correctly we need to calculate the left-position of the layer. Which obviously is screen-width minus the layerwidth and then divided by 2.
example:
documentwidth:800
layerwidth:600
800 - 600 = 200
200 / 2 = 100
and that's right. So there you are.
I hope you have enough information.
regards,
CJ
ch_pos is a function which, in general, looks for the current document width (NS and IE) and put the calculated left into the layer.
max_width contains the current document-width.
Then it gts a reference to the layer called Layer1 (case sensitive!!). Also for both IE and NS. Then it gets the current width of that one layer. Which will be stored in l_width. To center the layer correctly we need to calculate the left-position of the layer. Which obviously is screen-width minus the layerwidth and then divided by 2.
example:
documentwidth:800
layerwidth:600
800 - 600 = 200
200 / 2 = 100
and that's right. So there you are.
I hope you have enough information.
regards,
CJ
ASKER
Some final questions...
So what, then, positions the layer initially?
Is there a way to call the function from the div tag, so that EVERY time that the layer is shown, it checks to make sure that it is centered first?
So what, then, positions the layer initially?
Is there a way to call the function from the div tag, so that EVERY time that the layer is shown, it checks to make sure that it is centered first?
ASKER
oh yeah, this is for more than one layer, so how do I pass the layer name as a variable to the function?
function ch_pos(layer_name)
{
max_width = (n)?document.innerWidth:do
Obj = (n)?document.layers[layer_
l_width = Obj.width;
Obj.left = (max_width - l_width)/2;
}
use the above written function and when you call the function use
ch_pos("Layer1")
or whatever layer-name.
regards,
CJ
{
max_width = (n)?document.innerWidth:do
Obj = (n)?document.layers[layer_
l_width = Obj.width;
Obj.left = (max_width - l_width)/2;
}
use the above written function and when you call the function use
ch_pos("Layer1")
or whatever layer-name.
regards,
CJ
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks for all the help CJ_S !!
Sorry it took a while for me to understand.
Thank you,
Andy
Sorry it took a while for me to understand.
Thank you,
Andy
Ur welcome. I'm glad to be of any help to anyone =)....
it makes me learn too, by practicing and keeping to use my new learned stuff...=).
Thnx for the points
it makes me learn too, by practicing and keeping to use my new learned stuff...=).
Thnx for the points
ASKER
Oh, one last thing...
In the <div> tag, what do I do about the position "left..."- Does it not matter since it will be centered on "show?"
In the <div> tag, what do I do about the position "left..."- Does it not matter since it will be centered on "show?"
<head>
<script>
n = (navigator.appName=="Netsc
function ch_pos()
{
Obj = (n)?document.layers["Layer
Obj.left = Find_horizontalPosition();
}
</script>
</head>
<body onresize='ch_pos()'>
Just readd the above script. inside the Body there's an onresize which you can use to call a function once resized. I kinda made it a new function but you could easily transform it into anything you'd like.
regards,
CJ