PDA

View Full Version : Stay on Top Script not displaying correctly in IE7



bbarton
08-26-2009, 09:08 PM
1) Script Title: Stay on Top Content Script not displaying correctly in IE7

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/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?

ddadmin
08-27-2009, 01:24 AM
Please post a link to the page on your site that contains the problematic script so we can check it out.

bbarton
08-27-2009, 03:06 AM
http://www.freehomeownershiphelp.org

bbarton
08-27-2009, 09:25 PM
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

stringcugu
08-28-2009, 06:16 AM
<script type="text/javascript">

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

</script>

bbarton
08-28-2009, 06:42 AM
That does not do anything. Position changes the x,y coordinates relative to what orientation is set. Thanks though.

stringcugu
08-28-2009, 07:28 AM
<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>

ddadmin
08-30-2009, 06:37 PM
bbarton:
The script you're using on the test page is not Stay on Top script (http://www.dynamicdrive.com/dynamicindex17/stayontop.htm), but rather, another one. Is the issue you're having with the former?

stringcugu
08-31-2009, 02:05 AM
<!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: http://www.dynamicdrive.com.
//** Script available at usage terms at http://www.dynamicdrive.com
//** 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>

stringcugu
08-31-2009, 07:03 AM
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();

bbarton
09-02-2009, 06:44 AM
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.

bbarton
09-11-2009, 07:26 PM
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.