Implementing slider which repositions itself on window resize

[nmalik]

Hello All,

I got a neat slider code from

http://www.devx.com/webdev/Article/9734/0/page/4

I want to use the slider (actually several sliders) for user inputs which will be embedded in a table (so it look neat and everything lines up)

Now the problem is when the window is resized the location of the slider doesn't move.. I guess this due to the 'position:absolute' in the javascript code.. I tried making it relative, but it didn't help.

I did a lame attempt by writing the following function

function compute_location()
{
var i;
var FrameHeight;
var FrameWidth;

if ( ie4 || ie5 || ie6 )
{
FrameHeight =
document.documentElement.clientHeight;
FrameWidth =
document.documentElement.clientWidth;
}
else
{
FrameHeight=window.innerHeight;
FrameWidth=window.innerWidth;
}

for (i=0; i<sliders.length; i++)
{
// As an example I am trying to position it in the center
// of the screen and one below the other
sliders[i].left = FrameWidth/2;
sliders[i].top = FrameHeight/2 + (i*150);
}
}

But what I would really like is to position it relative to the table in which the slider will be embedded... is there anyway to align the table cells with the slider?

Thanks,

NM

[Khalid Ali]

you can use position:fixed in conjunction with left and top percentag values

such as

position:absolute;
left:15%;
top:45%;

this will take care of that problem