I don't know why this is happening. I have two HTML DIVs, each one
containing a dynamically generated Flash movie. One of them is part
of the page layout and the other floats onto the screen above the
layout. The floating DIV should always be on top but it is not. The
two Flash movies seem to swap depths as they redraw themselves, which
creates a weired overlap issue. This happens even though I've set the
z-index on both of the target HTML DIVs.
I've included text from my HTML page and it's JS and CSS support
files. The JS is set to stop the Flash movie from appearing if the
user has seen the ad once that day so clear your cache and cookies for
each test.
Thanks for your help.
---------------------------------------
<html>
<!-- To deploy the Interstitial Ad solution, transfer the script
and link
tags from the header, the body tag's 'onLoad' statement, and the
'INTERSTITIAL AD SECTION' to the page where the ad should appear.
Next,
make sure the 'interstitial.js' and the 'interstitial.css' files are
referenced from the script and link tags, respectively. -->
<script type="text/javascript" src="src/interstitial.js"></script>
<link rel="stylesheet" type="text/css" href="src/interstitial.css" />
<title>IA Test (HTML/External Scripts)</title>
</head>
<body onLoad="if (showAd) appear();">
<div style="margin-top:100; margin-left:100;z-index:1;">
<!-- This is the link to the remote OAS ad tag -->
<script type="text/javascript">
document.write('<scr'+'ipt language="JavaScript"
type="text/javascript"
src="http://oascentral.law.com/RealMedia/ads/adstream_jx.ads/interstitial.law.com/IHC/@x96";></scr'+'ipt>');
</script>
</div>
<!-- INTERSTITIAL AD SECTION -->
<div id="floatingflash"
style="top:-400px;left:-150px;margin-left:45%;z-index:100;">
<!-- This is the close button that appears over
generated/visible ads -->
<div id="hideButtonTab">
<a id="hideButton" href="javascript:disappear();">Close [
X ]</a>
</div>
<!-- This is the link to the remote OAS ad tag -->
<script type="text/javascript">
if ( userHasNotSeenAd() ) {
showAd = true;
document.write('<scr'+'ipt language="JavaScript"
type="text/javascript"
src="http://oascentral.law.com/RealMedia/ads/adstream_jx.ads/interstitial.law.com/IHC/@x96";></scr'+'ipt>');
<!-- Wait one second after call to ad tag, then test size of
floatingflash div -->
setTimeout('showHideButtonIfAdScheduled()', 1000 );
}
</script>
</div>
<!-- END INTERSTITIAL AD -->
</body>
</html>
---------------src/interstitial.css--------------
#floatingflash {
position:absolute;
display: block;
}
a#hideButton {
/* Display property is changed to from 'none' to 'block' upon
triggering the 'showHideButtonIfAdScheduled()' function */
display: none;
float: right;
height: 16px;
border: 1px solid #000000; /* black */
padding-top: 1px;
padding-right: 8px;
padding-bottom: 1px;
padding-left: 5px;
color: #000000;
background-color:#CCCCCC;
font-size: 11px;
font-family: Arial, Verdana, Helvetica, sans-serif;
font-weight: 600;
text-decoration: none;
text-align: left;
}
a#hideButton:hover {
color: #2080AF;
background-color:#CCCCCC;
}
#hideButtonTab {
width: 100%;
position: absolute;
top: -18px;
}
---------------src/interstitial.js--------------
var timeout;
var showAd = false;
/* -- COOKIE LOGIC -- */
function cookiesEnabled() {
Set_Cookie( 'test', 'none', '', '/', '', '' );
/*
If Get_Cookie succeeds, cookies are enabled, since
the cookie was successfully created.
*/
if ( Get_Cookie( 'test' ) ) {
cookie_set = true;
Delete_Cookie('test', '/', '');
} else {
document.write( 'cookies are not currently enabled.' );
cookie_set = false;
}
return cookie_set;
}
function setQuestCookie() {
Set_Cookie("questFlash","already seen",24,"/","","");
}
function Set_Cookie( name, value, expires, path, domain, secure ) {
// set time, it's in milliseconds
var today = new Date();
today.setTime( today.getTime() );
/*
if the expires variable is set, make the correct expires time, the
current
script below ( expires = expires * 1000 * 60 * 60 * 24 ) will set
'expires'
for 'X' number of days; to make it set for hours, delete * 24, for
minutes,
delete * 60 * 24
*/
if ( expires ) {
expires = expires * 1000 * 60 * 60;
}
var expires_date = new Date( today.getTime() + (expires) );
document.cookie = name + "=" +escape( value ) +
( ( expires ) ? ";expires=" + expires_date.toGMTString() : "" )
+
( ( path ) ? ";path=" + path : "" ) +
( ( domain ) ? ";domain=" + domain : "" ) +
( ( secure ) ? ";secure" : "" );
}
// this function gets the cookie, if it exists
function Get_Cookie( name ) {
var start = document.cookie.indexOf( name + "=" );
var len = start + name.length + 1;
if ( ( !start ) && ( name != document.cookie.substring( 0,
name.length ) ) ) {
return null;
}
if ( start == -1 ) {
return null;
}
var end = document.cookie.indexOf( ";", len );
if ( end == -1 ) {
end = document.cookie.length;
}
return unescape( document.cookie.substring( len, end ) );
}
// this deletes the cookie when called
function Delete_Cookie( name, path, domain ) {
if ( Get_Cookie( name ) ) {
document.cookie = name + "=" +
( ( path ) ? ";path=" + path : "") +
( ( domain ) ? ";domain=" + domain : "" ) +
";expires=Thu, 01-Jan-1970 00:00:01 GMT";
}
}
/* -- VISUAL LOGIC -- */
function appear() {
var the_style = getStyle( "floatingflash" );
/* adPositionDepth determines where the ad will stop; higher value
will equal lower point on page */
var endPosition = 300;
if ( the_style ) {
var current_top = parseInt( the_style.top );
var new_top = current_top + 5;
if ( document.layers ) {
the_style.top = new_top;
} else {
the_style.top = new_top + "px";
}
if ( new_top < endPosition ) {
the_timeout = setTimeout( 'appear();', 10 );
}
//Adjust inline style on page
the_style.marginLeft = 38 + "%";
}
} // appear
function disappear() {
var the_style = getStyle( "floatingflash" );
the_style.display = 'none';
} // disappear
function getStyle(ref) {
if( document.getElementById && document.getElementById(ref) ) {
return document.getElementById(ref).style;
} else if ( document.all && document.all(ref)) {
return document.all(ref).style;
} else if ( document.layers && document.layers[ref] ) {
return document.layers[ref];
} else {
return false;
}
} // getStyle
function showHideButtonIfAdScheduled() {
/* Show the interstitial div's close button ('X') if an ad loads into
the interstial div tag (a.k.a. "floatingflash"). If an ad is not
loaded,
the div will not grow passed the 'emptyDivSize'. */
var emptyDivSize = 10;
var hideButtonStyle = getStyle( "hideButton" );
var curWidth = parseInt( document.getElementById( "floatingflash"
).offsetWidth );
var curHeight = parseInt( document.getElementById( "floatingflash"
).offsetHeight );
if ( curWidth > emptyDivSize || curHeight > emptyDivSize ) {
hideButtonStyle.display = 'block';
}
}
/* -- MASTER TIRGGER FUNCTION -- */
function userHasNotSeenAd() {
var enableAd = true;
if ( Get_Cookie( "questFlash" )!= null ) {
enableAd = false;
} else {
setQuestCookie();
enableAd = true;
}
if ( !cookiesEnabled() ) {
enableAd = true;
}
return enableAd;
}
