<script> var obj; function float_div(divId,txt) { var background_Color; background_Color = 'red'; var text_color; text_color = 'black'; var borderColor; borderColor = '1px solid black'; var dWidth; dWidth = '150px'; var dPosition; dPosition = 'absolute'; var createEl = document.createElement("div"); createEl.setAttribute("id","floatDiv"); document.body.appendChild(createEl); divId = document.getElementById(divId); divId.onmousemove = function (e) { if (obj == null) { obj = document.getElementById("floatDiv"); obj.style.backgroundColor = background_Color; obj.style.color = text_color; obj.style.border = borderColor; obj.style.width = dWidth; obj.style.position = dPosition; obj.innerHTML = txt; } else { obj.style.display="block"; } var posx = 0; var posy = 0; if (!e) var e = window.event; if (e.pageX || e.pageY) { posx = e.pageX-10; posy = e.pageY-30; } else if (e.clientX || e.clientY) { posx = e.clientX-10; posy = e.clientY-30; } obj.style.left = parseInt(posx); obj.style.top = parseInt(posy) } divId.onmouseout = function () { obj.style.display="none"; } } </script> <div id="div1" style="border:1px solid red;width:200px;height:200px;">BLABLABLABLA</div> <script> float_div("div1","Rotter Rulllllzz") </script>
|
היו לך כמה בעיות:
1. ה-DIV שיצרת היה קרוב מדי לעכבר. לכן תזוזה ימינה גרמה לפעמים לעכבר לעלות על ה-DIV (התזוזה יותר מהירה מה-EVENT), ואז ה-DIV היה נעלם לפעמים. בגלל זה הגדרתי X ו-Y שונים יותר, ככה שאין מצב שהעכבר יזוז על ה-DIV האדום.
2. ברגע שה-DIV נעלם, הוא לא היה מופיע יותר, אם היית עולה על התיבה.