Stay on Top Script not displaying correctly in IE7

1) Script Title: Stay on Top Content Script not displaying correctly in IE7

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici.../stayontop.htm

3) Describe problem: The script shows correctly in IE8, firefox, chrome, safari, but if i view it on a computer with IE7 it leaves the div tag where i inserted it on the page. I have double checked url's and they are all correct. the .js file is where it needs to be. and my head tag has this

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

Does anyone have a solution?

Please post a link to the page on your site that contains the problematic script so we can check it out.

URL for issue

http://www.freehomeownershiphelp.org

Did a TEST

Check this out. I made a very simple html page with just text and then the script and it still displays incorrectly. The text "Test!" is where the Stay on top code is. http://freehomeownershiphelp.org/test.html

<script type="text/javascript">

alwaysOnTop.init({
targetid: 'examplediv',
orientation: 4,
position:[top=410,left=290],
fadeduration: [0, 0],
frequency: 1,
hideafter: 60000,
})

</script>

That does not do anything. Position changes the x,y coordinates relative to what orientation is set. Thanks though.

<DIV id="examplediv" style="BORDER-BOTTOM: gray 0px solid; BORDER-LEFT: gray 0px solid; PADDING-BOTTOM: 0px; PADDING-LEFT: 0px; WIDTH: 400px; PADDING-RIGHT: 0px; HEIGHT: 280px; BORDER-TOP: gray 0px solid; BORDER-RIGHT: gray 0px solid; PADDING-TOP: 0px;z-index:19;left:400px;top:1px" >
Test<IMG class=banner_1 border=0 alt=""
src="freehomeownershiphelp_org_files/loanmod.jpg" useMap=#Map>
</DIV>

bbarton:
The script you're using on the test page is not Stay on Top script, but rather, another one. Is the issue you're having with the former?

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script>//** Stay on Top content script- (c) Dynamic Drive DHTML code library: [url]http://www.dynamicdrive.com[/url]. //** Script available at usage terms at [url]http://www.dynamicdrive.com[/url] //** v1.0 (May 12th, 09') var alwaysOnTop={ dsettings: { targetid: '', orientation: 2, position: [10, 30], externalsource: '', frequency: 1, hideafter: 0, fadeduration: [500, 500], display: 0 //internal setting on whether to display target element at all (based on frequency setting) }, settingscache: {}, positiontarget:function($target, settings){ var fixedsupport=!document.all || document.all && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode var posoptions={position:fixedsupport? 'fixed':'absolute', visibility:'visible'} if (settings.fadeduration[0]>0) //if fade in posoptions.opacity=0 posoptions[(/^[13]$/.test(settings.orientation))? 'left' : 'right']=settings.position[0] posoptions[(/^[12]$/.test(settings.orientation))? 'top' : 'bottom']=settings.position[1] if (document.all && !window.XMLHttpRequest) //loose check for IE6 and below posoptions.width=$target.width() //IE6- seems to require an explicit width on a DIV $target.css(posoptions) if (!fixedsupport){ this.keepfixed($target, settings) var evtstr='scroll.' + settings.targetid + ' resize.'+settings.targetid jQuery(window).bind(evtstr, function(){alwaysOnTop.keepfixed($target, settings)}) } this.revealdiv($target, settings, fixedsupport) if (settings.hideafter>0){ //if hide timer enabled setTimeout(function(){ alwaysOnTop.hidediv(settings.targetid) }, settings.hideafter+settings.fadeduration[0]) } }, keepfixed:function($target, settings){ var $window=jQuery(window) var is1or3=/^[13]$/.test(settings.orientation) var is1or2=/^[12]$/.test(settings.orientation) var x=$window.scrollLeft() + (is1or3? settings.position[0] : $window.width()-$target.outerWidth()-settings.position[0]) var y=$window.scrollTop() + (is1or2? settings.position[1] : $window.height()-$target.outerHeight()-settings.position[1]) $target.css({left:x+'px', top:y+'px'}) }, revealdiv:function($target, settings){ if (settings.fadeduration[0]>0) //if fade in $target.show().animate({opacity:1}, settings.fadeduration[0]) else $target.show() if (settings.frequency=="session") //set session only cookie (name: 'sots' + targetid)? this.setCookie('sots'+settings.targetid, 'shown') else if (/^\d+ day/i.test(settings.frequency)){ //set persistent cookie (name: 'sotp' + targetid)? var persistdays=parseInt(settings.frequency) this.setCookie('sotp'+settings.targetid, persistdays, persistdays) } }, hidediv:function(targetid){ //public function var $target=jQuery('#'+targetid) if ($target.css('display')=='none') //if target hidden already return var settings=this.settingscache[targetid] if (settings.fadeduration[1]>0) //if fade out $target.animate({opacity:0}, settings.fadeduration[1], function(){$target.hide()}) else $target.hide() var evtstr='scroll.' + settings.targetid + ' resize.'+settings.targetid jQuery(window).unbind(evtstr) }, loadajaxcontent:function($, settings){ $.ajax({ url: settings.externalsource, error:function(ajaxrequest){ alert('Error fetching Ajax content.\nServer Response: '+ajaxrequest.responseText) }, success:function(content){ var $target=$(content) if ($target.get(0).id==settings.targetid) alwaysOnTop.positiontarget($target.appendTo('body'), settings) else alert('Error: The value you have entered for "targetid" ('+settings.targetid+') ' + 'doesn\'t match the ID of your remote content\'s DIV container ('+$target.get(0).id+'). This must be corrected' ) } }) }, init:function(options){ var settings={} settings=jQuery.extend(settings, this.dsettings, options) this.settingscache[settings.targetid]=settings if (typeof settings.frequency=="number") //value of 1=show, 0=hide settings.display=(settings.frequency>Math.random())? 1 : 0 else if (settings.frequency=="session") settings.display=(this.getCookie('sots'+settings.targetid)=='shown')? 0 : 1 //session cookie name: 'sots' + targetid else if (/^\d+ day/i.test(settings.frequency)){ //match 'xx days' //If admin has changed number of days to persist from current cookie records, reset persistence by deleting cookie if (parseInt(this.getCookie('sotp'+settings.targetid))!= parseInt(settings.frequency)) this.setCookie('sotp'+settings.targetid, '', -1) settings.display=(this.getCookie('sotp'+settings.targetid)!=null)? 0 : 1 //persistent cookie name: 'sotp' + targetid } jQuery(document).ready(function($){ if (settings.externalsource!='' && settings.display){ //if ajax content alwaysOnTop.loadajaxcontent($, settings) } else if (settings.externalsource==''){ //inline content var $target=$('#'+settings.targetid) if (!settings.display){ //if hide content (based on frequency setting) $target.hide() return false } else{ alwaysOnTop.positiontarget($target, settings) } } }) //end ready }, getCookie:function(Name){ var re=new RegExp(Name+"=[^;]*", "i"); //construct RE to search for target name/value pair if (document.cookie.match(re)) //if cookie found return document.cookie.match(re)[0].split("=")[1] //return its value return null }, setCookie:function(name, value, days){ if (typeof days!="undefined"){ //if set persistent cookie var expireDate = new Date() var expstring=expireDate.setDate(expireDate.getDate()+days) document.cookie = name+"="+value+"; expires="+expireDate.toGMTString() } else document.cookie = name+"="+value+"; path=/" } } </script> <script type="text/javascript"> alwaysOnTop.init({ targetid: 'examplediv', orientation: 5, position: [415, +400], fadeduration: [1000, 1000], frequency: 0.95, hideafter: 1000 }) alwaysOnTop.init({ targetid: 'examplediv0', orientation: 4, position: [615, +300], fadeduration: [1000, 1000], frequency: 0.95, hideafter: 3000 }) alwaysOnTop.init({ targetid: 'examplediv00', orientation: 3, position: [695, +200], fadeduration: [1000, 1000], frequency: 0.95, hideafter: 5000 }) alwaysOnTop.init({ targetid: 'examplediv000', orientation: 2, position: [860, +190], hideafter: 10000, //externalsource: 'bc.htm' }) alwaysOnTop.init({ targetid: 'ajaxdiv1', orientation: 1, position: [920, +300], hideafter: 10000, //externalsource: 'bc.htm' }) </script> <div id="examplediv" style="width:140px; border:1px solid gray; padding: 10px; background: lightyellow"> examplediv This DIV is static and shown 95% of the time the page loads. It's positioned relative to the lower left corner of the window. It disappears after 15 seconds. </div> <div id="examplediv00" style="width:140px; border:1px solid gray; padding: 10px; background: lightyellow"> examplediv<a href="http://www.hellobc.com/en-CA/default.htm"><img src="http://i40.tinypic.com/2agthk6.gif" style="border-width:0" /></a> This DIV is static and shown 95% of the time the page loads. It's positioned relative to the lower left corner of the window. It disappears after 15 seconds. <a href="http://www.hellobc.com/en-CA/default.htm"><img src="http://i40.tinypic.com/2agthk6.gif" style="border-width:0" /></a> </div> <div id="examplediv0" style="width:140px; border:1px solid gray; padding: 10px; background: lightyellow"> examplediv<a href="http://www.hellobc.com/en-CA/default.htm"><img src="http://i40.tinypic.com/2agthk6.gif" style="border-width:0" /></a> This DIV is static and shown 95% of the time the page loads. It's positioned relative to the lower left corner of the window. It disappears after 15 seconds. <a href="http://www.hellobc.com/en-CA/default.htm"><img src="http://i40.tinypic.com/2agthk6.gif" style="border-width:0" /></a> </div> <div id="examplediv000" style="width:140px; border:1px solid gray; padding: 10px; background: lightyellow"> examplediv<a href="http://www.hellobc.com/en-CA/default.htm"><img src="http://i40.tinypic.com/2agthk6.gif" style="border-width:0" /></a> This DIV is static and shown 95% of the time the page loads. It's positioned relative to the lower left corner of the window. It disappears after 15 seconds. <a href="http://www.hellobc.com/en-CA/default.htm"><img src="http://i40.tinypic.com/2agthk6.gif" style="border-width:0" /></a> </div> <div id="ajaxdiv1" style="width:140px; border:1px solid gray; padding: 10px; background: lightyellow"> ajaxdiv1<a href="http://www.hellobc.com/en-CA/default.htm"><img src="http://i40.tinypic.com/2agthk6.gif" style="border-width:0" /></a> This DIV is static and shown 95% of the time the page loads. It's positioned relative to the lower left corner of the window. It disappears after 15 seconds. <a href="http://www.hellobc.com/en-CA/default.htm"><img src="http://i40.tinypic.com/2agthk6.gif" style="border-width:0" /></a> </div>

for this link
http://freehomeownershiphelp.org/test.html
change self.innerHeight+115 to self.innerHeight-315 from ( + )to( - )

if (ie){documentWidth =truebody().offsetWidth-5+truebody().scrollLeft-20;
documentHeight =truebody().offsetHeight-275+truebody().scrollTop-20;}
else if (ns){documentWidth=window.innerWidth-5+window.pageXOffset-20;
documentHeight=window.innerHeight-315+window.pageYOffset-20;}
else if (w3){documentWidth=self.innerWidth-5+window.pageXOffset-20;
documentHeight=self.innerHeight-315+window.pageYOffset-20;}
adDiv.left=documentWidth-200+calunit;adDiv.top =documentHeight-200+calunit;
setTimeout("showAd()",100);}else closeAd();

I used another script. I did everything that was needed in the stay on top script and would not work. And didn't get a response so moved on, but thanks for the help. It worked in ie8 fine but not in ie6 or 7.

I made use of another script. I like the stay on top better but would like it to work in other browsers. The test.html does not have the script now.