Move the mouse to the div, the floating layer displays details, and the pop-up layer coincides with the top and left margins of the div (sample code)_javascript skills

As shown below:

Copy the code The code is as follows: .toopTip ; border-color:Red; The left boundary of the DIV overlaps with the displayed DIV in the upper boundary, so you need to delete the document head W3C standard. ://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

*/ function initEvent() { var divArray = document.getElementsByTagName(" div"); for (var i = 0; i divArray[i].onmouseover = createDivDetailOne; /* Cannot be tied with original div The incident of fixed mouse removed, because the width length of the details of the details is greater than the original DIV, The original div is covered, at this time it will be automatically triggered by the ONMouseout event */ // DIVARAY [i].onmouseout = removeDivDetail; } } function createDivDetailOne() { //Guarantee the uniqueness of divDetail div var divDetail = document.getElement ById("divDetail"); divObj = document.createElement("div"); divObj.className = "toopTip"; divObj.setAttribute("id", "divDetail"); divOb j.style.position = "absolute"; divObj.style.width = "200px"; divObj.style.height = "100px"; var triggerObj = window.event.srcElement; divObj.style.top = triggerObj.offsetTop; divObj.style.left = triggerObj.offsetLeft; divObj.innerHTML = triggerObj.innerText; document.body.appendChild(divObj); // Used at this time The detailed div has covered the original div, so the covered div needs to be event processed document.getElementById("divDetail").onmouseout = function() { divObj = this; if (!divObj ) { Return; } Document.body.removechild (divobj); }; }> Function RemoveDIVDetail GetelementByid ( "divDetail"); if (!divObj) { return; } document.body.removeChild(divObj); }

window.onload = initEvent;

Hello My Js World! Welcome to This IS My Js World! !