Hover Cue Box effect

var Ieauto = navigator.userAgent.indexOf (' MSIE ') >-1; Determine if IE is not and assign a value to the variable window.onload=function () {function Show (obj,id,html,width,height) {if (document.getElementById ( ID) {//==null) {//Determine if the ID of the created div is empty var div = document.createelement (' div ');//Create divdiv.classname = ' tooltip-box ';// Add a classsdiv.id = id;//to the created Div to add a iddiv.innerhtml = html;//Create div display content div.style.width = width?width+ ' px ': ' AUT  O ';      Set div width IE does not support atuoif (!width && ieauto) {//If the width is not set and is IE browser div.style.width = div.offsetwidth; Set the div width to the browser-rendered width}obj.appendchild (div) under IE browsers that do not have a width set and do not support auto, or the div is inserted inside the Obj object (that is, a tag) div.style.position = ' Absolute ';//give the created div an absolute positioning attribute//Set the bounds of the cue box var win = document.body.clientwidth| | Document.documentelement.clientwidth;var L = obj.offsetleft,//Gets the left top value of a label t = obj.offsettop;if (l+div.offsetwidth > Win) {//obj left value and the value of the width of the Cue box > browser window value var DMO = document.getElementById (' demo '); l = Win-div.offsetwid Th-dmo.offsetleft;if (l<0) {l=0}}div.style.left = l + ' px ';  The left top value of the created Div is equal to the top value of the A label div.style.top = (t+20) + ' px '; Obj.onmouseleave=function () {//mouse away div hidden setTimeout Delay effect setTimeout (function () {document.getElementById (id). style.display = ' none ';},300);} }else{//display document.getElementById (id). style.display = ' block ';}}; var t1 = document.getElementById (' tooltip1 '); T1.onmouseenter=function () {Show (this, ' T1 ', ' 12334 ', 200)}}

　　

Hover Cue Box effect