This works :

<script type="text/javascript">
function test(){
var vp_dims = document.viewport.getDimensions();
var vp_scrolloffset = document.viewport.getScrollOffsets();
var mydivdims = $('mydiv').getDimensions();
$('mydiv').setStyle({ top:''+Math.abs((vp_dims.height-
mydivdims.height)/'px', left:''+Math.abs
((vp_dims.width-mydivdims.width)/2+vp_scrolloffset.left)+'px' });

document.observe('dom:loaded', function() {
        Event.observe(window, 'resize', test, true);
        Event.observe(window, 'scroll', test, true);
and then :
<div id="mydiv" style="position:absolute; width:500px; height:250px;
color:#F00; background-color:#9999FF; display:none;"></div>

you have to declare the style propertes of "mydiv" when you create it

It works a bit fine on IE & FF but "flicky" when you scroll.
The div.hide() / i added in the function are not efficient
enough to prevent it...

Tell me if this is what you wanted.

Best regards.
You received this message because you are subscribed to the Google Groups 
"Prototype &" group.
To post to this group, send email to
To unsubscribe from this group, send email to
For more options, visit this group at

Reply via email to