Cool DHTML Tooltip II, layering problem with select box!

[EZboy]

Cool DHTML Tooltip II

http://www.dynamicdrive.com/dynamici...mltooltip2.htm

Hello everybody, i have a strange problem with the tooltip. It works perfectly fine except when viewd in IE when there is a <select> box in a form. In case of overlapping it hides behind it. But it works fine in Firefox!!!!
Thanks for your help!!!

[EZboy]

Ok, i solved this problem by masking the select with an IFRAME, the javascript code was modified and i attach it below, maybe it will help someone! By the way the bug will be fixed as of IE 7.

Maybe someone wants to modify it so the IFRAME is always the same size as a tooltip!!!! That would be great!!!

<script type="text/javascript">
/***********************************************
* Cool DHTML tooltip script II- &#169; Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var offsetfromcursorX=12 //Customize x offset of tooltip
var offsetfromcursorY=10 //Customize y offset of tooltip

var offsetdivfrompointerX=10 //Customize x offset of tooltip DIV relative to pointer image
var offsetdivfrompointerY=14 //Customize y offset of tooltip DIV relative to pointer image. Tip: Set it to (height_of_pointer_image-1).

document.write('<div style="display:block;" id="dhtmltooltip"></div>') //write out tooltip DIV
document.write('<iframe id="DivShim" src="javascript:false;" scrolling="no" frameborder="0" style="position:absolute;  display:none; width:160px; height:70px;"> </iframe>')
document.write('<img id="dhtmlpointer" src="arrow2.gif">') //write out pointer image

var ie=document.all
var ns6=document.getElementById && !document.all
var enabletip=false
if (ie||ns6)
var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""
//this line added
var tipobj2=document.all? document.all["DivShim"] : document.getElementById? document.getElementById("DivShim") : ""
var pointerobj=document.all? document.all["dhtmlpointer"] : document.getElementById? document.getElementById("dhtmlpointer") : ""

function ietruebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function ddrivetip(thetext, thewidth, thecolor){
if (ns6||ie){
if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
tipobj.innerHTML=thetext
enabletip=true
//added here
tipobj2.style.display="block"
return false
}
}

function positiontip(e){
if (enabletip){
var nondefaultpos=false
var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
//Find out how close the mouse is to the corner of the window
var winwidth=ie&&!window.opera? ietruebody().clientWidth : window.innerWidth-20
var winheight=ie&&!window.opera? ietruebody().clientHeight : window.innerHeight-20

var rightedge=ie&&!window.opera? winwidth-event.clientX-offsetfromcursorX : winwidth-e.clientX-offsetfromcursorX
var bottomedge=ie&&!window.opera? winheight-event.clientY-offsetfromcursorY : winheight-e.clientY-offsetfromcursorY

var leftedge=(offsetfromcursorX<0)? offsetfromcursorX*(-1) : -1000

//if the horizontal distance isn't enough to accomodate the width of the context menu
if (rightedge<tipobj.offsetWidth){
//move the horizontal position of the menu to the left by it's width
tipobj.style.left=curX-tipobj.offsetWidth+"px"
//this line added
tipobj2.style.left=curX-tipobj.offsetWidth+"px"
nondefaultpos=true
}
else if (curX<leftedge){
tipobj.style.left="5px"
// added here
tipobj2.style.left="5px"
}
else{
//position the horizontal position of the menu where the mouse is positioned
tipobj.style.left=curX+offsetfromcursorX-offsetdivfrompointerX+"px"
//added here
tipobj2.style.left=curX+offsetfromcursorX-offsetdivfrompointerX+"px"
pointerobj.style.left=curX+offsetfromcursorX+"px"
}

//same concept with the vertical position
if (bottomedge<tipobj.offsetHeight){
tipobj.style.top=curY-tipobj.offsetHeight-offsetfromcursorY+"px"
//added here
tipobj2.style.top=curY-tipobj.offsetHeight-offsetfromcursorY+"px"
nondefaultpos=true
}
else{
tipobj.style.top=curY+offsetfromcursorY+offsetdivfrompointerY+"px"
//added here
tipobj2.style.top=curY+offsetfromcursorY+offsetdivfrompointerY+"px"
pointerobj.style.top=curY+offsetfromcursorY+"px"
}
tipobj.style.visibility="visible"
if (!nondefaultpos)
pointerobj.style.visibility="visible"
else
pointerobj.style.visibility="hidden"
}
}

function hideddrivetip(){
if (ns6||ie){
enabletip=false
tipobj.style.visibility="hidden"
pointerobj.style.visibility="hidden"
tipobj.style.left="-1000px"
tipobj.style.backgroundColor=''
tipobj.style.width=''
//added here
tipobj2.style.display="none"
//tipobj2.style.visibility="hidden"
//tipobj2.style.left="-1000px"
//tipobj2.style.backgroundColor=''
//tipobj2.style.width=''
}
}

document.onmousemove=positiontip

</script>

[jscheuer1]

http://www.dynamicdrive.com/forums/s...56&postcount=4

[EZboy]

Oh Thanks!!! If i only knew about it earlier.... 2 hours wasted!!!