I am currently using the code below to bring up a pop-up window (with Iframe) within the current page when a link is pushed. However the way my page is formatted one of the links is at on the right side of the page. When the link is clicked the popup window comes up outside the current window.
Is there a way to add additional code so that if the popup window is going to go outside the boundaries of the current window it is automatically aligned to the end of the page?
<body>
<script TYPE="text/javascript"><!--
function move_box(an, box)
{
var cleft = -200;
var ctop = 0;
var obj = an;
while (obj.offsetParent)
{
cleft += obj.offsetLeft;
ctop += obj.offsetTop;
obj = obj.offsetParent;
}
box.style.left = cleft + 'px';
ctop += an.offsetHeight + 8;
if (document.body.currentStyle &&
document.body.currentStyle['marginTop'])
{
ctop += parseInt(
document.body.currentStyle['marginTop']);
}
box.style.top = ctop + 'px';
}
function show_hide_box(an, width, height, borderStyle)
{
var href = an.href;
var boxdiv = document.getElementById(href);
if (boxdiv != null)
{
if (boxdiv.style.display=='none')
{
// Show existing box, move it
// if document changed layout
move_box(an, boxdiv);
boxdiv.style.display='block';
}
else
// Hide currently shown box.
boxdiv.style.display='none';
return false;
}
boxdiv = document.createElement('div');
boxdiv.setAttribute('id', href);
boxdiv.style.display = 'block';
boxdiv.style.position = 'absolute';
boxdiv.style.width = width + 'px';
boxdiv.style.height = height + 'px';
boxdiv.style.border = borderStyle;
boxdiv.style.textAlign = 'right';
boxdiv.style.padding = '2px';
boxdiv.style.background = '#C0C0C0';
document.body.appendChild(boxdiv);
var offset = 0;
var close_href = document.createElement('a');
close_href.href = 'javascript:void(0);';
close_href.onclick = function()
{ show_hide_box(an, width, height, borderStyle); }
close_href.style.fontFamily = 'Verdana';
close_href.style.fontSize = '8';
close_href.style.fontWeight = 'bold';
close_href.appendChild(document.createTextNode('Close [X]'));
boxdiv.appendChild(close_href);
offset = close_href.offsetHeight;
var contents = document.createElement('iframe');
contents.frameBorder = '0';
contents.style.width = width + 'px';
contents.style.height = (height - offset) + 'px';
boxdiv.appendChild(contents);
move_box(an, boxdiv);
if (contents.contentWindow)
contents.contentWindow.document.location.replace(
href);
else
contents.src = href;
return false;
}
//--></script>
</body>
<a href="page.html" onclick="return show_hide_box(this, 525, 350, '0px solid')" style="text-decoration: none">This is the link</a>
<body>
<script TYPE="text/javascript">
<!--
function move_box(an, box, width, height)
{
var cleft = -200;
var ctop = 0;
var obj = an;
var maxwidth=xtable.offsetWidt
while (obj.offsetParent)
{
cleft += obj.offsetLeft;
ctop += obj.offsetTop;
obj = obj.offsetParent;
}
if (cleft+width >= maxwidth) cleft=maxwidth-width;
box.style.left = cleft + 'px';
ctop += an.offsetHeight + 8;
if (document.body.currentStyl
document.body.currentStyle
{
ctop += parseInt(
document.body.currentStyle
}
box.style.top = ctop + 'px';
}
function show_hide_box(an, width, height, borderStyle)
{
var href = an.href;
var boxdiv = document.getElementById(hr
if (boxdiv != null)
{
if (boxdiv.style.display=='no
{
// Show existing box, move it
// if document changed layout
move_box(an, boxdiv,width,height);
boxdiv.style.display='bloc
}
else
// Hide currently shown box.
boxdiv.style.display='none
return false;
}
boxdiv = document.createElement('di
boxdiv.setAttribute('id', href);
boxdiv.style.display = 'block';
boxdiv.style.position = 'absolute';
boxdiv.style.width = width + 'px';
boxdiv.style.height = height + 'px';
boxdiv.style.border = borderStyle;
boxdiv.style.textAlign = 'right';
boxdiv.style.padding = '2px';
boxdiv.style.background = '#C0C0C0';
document.body.appendChild(
var offset = 0;
var close_href = document.createElement('a'
close_href.href = 'javascript:void(0);';
close_href.onclick = function()
{ show_hide_box(an, width, height, borderStyle); }
close_href.style.fontFamil
close_href.style.fontSize = '8';
close_href.style.fontWeigh
close_href.appendChild(doc
boxdiv.appendChild(close_h
offset = close_href.offsetHeight;
var contents = document.createElement('if
contents.frameBorder = '0';
contents.style.width = width + 'px';
contents.style.height = (height - offset) + 'px';
boxdiv.appendChild(content
move_box(an, boxdiv, width, height);
if (contents.contentWindow)
contents.contentWindow.doc
href);
else
contents.src = href;
return false;
}
//--></script>
</body>
&n
&n
&n
&n
&n
&n
<a href="page.html" onclick="return show_hide_box(this, 525, 350, '0px solid')" style="text-decoration: none">This is the link</a>
<table width=100% id=xtable height=0><tr><td></td></tr