lorenw
October 25, 2010, 3:42pm
1
Hi all,
I have a popup timer and would like to option of keeping the popup on top of the parent window.
Here is what I have so far.
Two radio buttons
<input name="ontop" class="ontop" type="radio" value="y" Onclick="ontop('y')">y
<input name="ontop" class="ontop" type="radio" value="n" Onclick="ontop('n')">n
The JS
function ontop(yn) {
document.getElementById("ontop")
if (yn == 'y'){
alert ("Focus");
self.focus();
}
else{}
}
I get the alert but the popup doesn’t stay on top.
Can anyone help with a solution? This (I hope) has a simple solution.
Thanks.
Do you mean it doesn’t continue covering the original window if you move the focus (or just click) on the original window?
lorenw
October 25, 2010, 9:05pm
3
Exactly, window pops up but any click on the parent and the popup goes behind.
I even called the function from body onload, got the alert but still went behind the parent.
Thing is, I thought which window is on top was controlled by the users Windowing manager (so Windows, or Gnome, or KDE, or whatever Mac people use), not Javascript. Someone can enlighten me if I’m wrong, but I’m thinking this is outside the power of Javascript.
lorenw
October 26, 2010, 12:45pm
5
I’m coming to the conclusion that with tabbed browsers (which tab is parent) that this feature is no longer supported. Here is a link and I’m sure it worked at some point and I don’t see a date.
http://javascript.internet.com/page-details/top-window.html
As you can see it doesn’t work. I will quit banging my head and move on. I will keep looking here to see if an answer arises though. It would be a nice feature to have.
Thanks.
Why don’t you combine some CSS and Javascript?
Something like this
<html>
<head><title>onTop</title>
<style type="text/css">
#ontopDiv{
display:none;
z-index:2;
background: #orange;
color:#000;
width: 200px;
height: 200px;
padding:10px;
left:200px;
position: absolute;
}
</style>
<script type="text/javascript">
function onTop(value)
{
if(value =='y'){
document.getElementById("ontopDiv").style.display = 'block';
}else if(value =='n'){
document.getElementById("ontopDiv").style.display = 'none';
}
}
</script>
</head>
<body>
<div id="ontopDiv">Yes I am on top!</div>
<label>Show div</label><input name="ontop" class="ontop" type="radio" value="y" onClick="onTop('y')" />
<label>Hide div</label><input name="ontop" class="ontop" type="radio" value="n" onClick="onTop('n')" />
</body>
</html>
You can easily at a timer to the Javascript function so that div opens / closes after the indicated time. Hopefully this helps a bit.