troubleshooting Question

How to fire an overlay on click?

Avatar of darja22
darja22 asked on
JavaScriptPHPAJAX
8 Comments1 Solution1228 ViewsLast Modified:
Hi experts :)
I have a free gamesite and trying to do this:
When user clicks on a game, my script has to fireup an overlay (freezes the background in the process). But, how to do this, without having to embed link and onclick func. for every single game on site, but to do it globally?The script also checks, if my app is already installed on user's PC. If not, an overlay is fired up.
Below is my code so far; what has to be corrected or can all this be done easier way?
Pls, help!
1. Sample index.php: 
<html> 
<head> 
 
<script src="test.js"></script> 
</head>
	<body onLoad="loadContent();" style="position:relative; display:block">
<div id=mask style="width:100%; height:100%; position:absolute; z-index:1000;  background-color: black; filter:alpha(opacity=50);-moz-opacity:.50;opacity:.50;left:0px; top:0px; display:block; visibility:hidden" align=center></div>
<div id=mask2 style=" position: absolute; width: 650px;  z-index:1500;  display:block; margin-left:50%; visibility:hidden" ><div style='position:absolute; z-index:1500; width:650px; height:450px;  background-color:white;  border:1px solid gray; margin-left:-325px;  display:block; margin-top:200px;  ' align=center><?php include_once("mgate.php");?></div></div> 
<h1><a href="http://domain.com/Flash/402.swf">Play now!</a></h1>
</body> 
</html> 
2. Test.js: 
<script type="text/javascript">
		toolbar=0;
		function ToolBarInit(tool) {
			toolbar=1;
		}
 
		function checkToolbar(){
			if(toolbar!=1) {
				window.location.href="http://domain.com/mgate.php";
			}
		}
		</script> 
<script language="javascript">
document.getElementById('mask').style.visibility='visible'
document.getElementById('mask2').style.visibility='visible'
 
document.getElementById('mask').style.height=document.body.clientHeight
 
function loadContent(){
 
if(toolbar==1){ document.getElementById('cont').innerHTML='<div width=500 height=500 style="overflow: hidden;" id=media_container><embed src= "http://www.odeo.com/flash/audio_player_standard_gray.swf" quality="high" width="300" height="52" allowScriptAccess="always" wmode="transparent"  type="application/x-shockwave-flash" flashvars= "valid_sample_rate=true&external_url=<?=$_GET[url];?>" pluginspage="http://www.macromedia.com/go/getflashplayer"> </embed></div>'
document.getElementById('mask').style.visibility='hidden'
document.getElementById('mask2').style.visibility='hidden'
 
}
}
</script>
<div id=cont></div>
Join the community to see this answer!
Join our exclusive community to see this answer & millions of others.
Unlock 1 Answer and 8 Comments.
Join the Community
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 8 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros