Well you may want to revisit that thread after all:
http://www.dynamicdrive.com/forums/s...ad.php?t=38205
Though it was definitely a different question, the answer may be of help to you, insofar as the real way to do this is via style, not script.
But if you want to use this script, I think I have figured out why it is behaving badly in compliance mode in those browsers.
First of all (probably inconsequential, but certainly could cause problems when combined with other code) on the demo page, they tell you to put this in the head:
Code:
<style type="text/css">
.dockclass{
position:relative;
}
</style>
<body>
<script type="text/javascript">
/***********************************************
* Dock Content script- Created by and © Dynamicdrive.com
* This notice must sta . . .
There should never be a body tag in the head. Get rid of that.
Now the real trouble is that in compliance mode (under a valid URL DTD), those browsers not working will not recognise certain objects used by the script. There are alternative objects that are roughly equivalent that they will recognise in compliance mode though, but some of the currently working browsers still need the original ones even in compliance mode. So I did some branching (highlighted, in two areas):
Code:
<script type="text/javascript">
/***********************************************
* Dock Content script- Created by and © Dynamicdrive.com
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full script
***********************************************/
var offsetfromedge=0 //offset from window edge when content is "docked". Change if desired.
var dockarray=new Array() //array to cache dockit instances
var dkclear=new Array() //array to cache corresponding clearinterval pointers
function dockit(el, duration){
this.source=document.all? document.all[el] : document.getElementById(el);
this.source.height=this.source.offsetHeight;
this.docheight=truebody().clientHeight || !window.innerHeight? truebody().clientHeight : window.innerHeight;
this.duration=duration;
this.pagetop=0;
this.elementoffset=this.getOffsetY();
dockarray[dockarray.length]=this;
var pointer=eval(dockarray.length-1);
var dynexpress='dkclear['+pointer+']=setInterval("dockornot(dockarray['+pointer+'])",100);';
dynexpress=(this.duration>0)? dynexpress+'setTimeout("clearInterval(dkclear['+pointer+']); dockarray['+pointer+'].source.style.top=0", duration*1000)' : dynexpress;
eval(dynexpress);
}
dockit.prototype.getOffsetY=function(){
var totaloffset=parseInt(this.source.offsetTop);
var parentEl=this.source.offsetParent;
while (parentEl!=null){
totaloffset+=parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}
function dockornot(obj){
obj.pagetop=truebody().scrollTop || !window.pageYOffset? truebody().scrollTop : pageYOffset;
if (obj.pagetop>obj.elementoffset) //detect upper offset
obj.source.style.top=obj.pagetop-obj.elementoffset+offsetfromedge+"px";
else if (obj.pagetop+obj.docheight<obj.elementoffset+parseInt(obj.source.height)) //lower offset
obj.source.style.top=obj.pagetop+obj.docheight-obj.source.height-obj.elementoffset-offsetfromedge+"px";
else
obj.source.style.top=0;
}
function truebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
</script>
Other than getting rid of the body tag from the head, and using this updated version of the main script, everything else should remain as directed on the demo page.
Bookmarks