javascript彈出帶文字信息的提示框效果_

1、javascript彈出帶文字信息的提示框效果_ js作用域是前端開發(fā)必把握的基礎(chǔ)學(xué)問。這篇文章主要介紹了javascript中的作用域的相關(guān)資料,需要的伴侶可以參考下 本文實(shí)例講解并描述了javascript彈出帶文字信息的提示框效果。分享給大家供大家參考，具體如下： tooltips.js: / position of the tooltip relative to the mouse in pixel / var offsetx = 12; var offsety = 8; function newelement(newid) if(document.createElement) var

2、 el = document.createElement(div); el.id = newid; with(el.style) display = none; position = absolute; el.innerHTML = ; document.body.appendChild(el); var ie5 = (document.getElementByIdx document.all); var ns6 = (document.getElementByIdx !document.all); var ua = navigator.userAgent.toLowerCase(); var

3、 isapple = (ua.indexOf(applewebkit) != -1 ? 1 : 0); function getmouseposition(e) if(document.getElementByIdx) var iebody=(patMode patMode != BackCompat) ? document.documentElement : document.body; pagex = (isapple = 1 ? 0:(ie5)?iebody.scrollLeft:window.pageXOffset); pagey = (isapple = 1 ? 0:(ie5)?ie

4、body.scrollTop:window.pageYOffset); mousex = (ie5)?event.x:(ns6)?clientX = e.clientX:false; mousey = (ie5)?event.y:(ns6)?clientY = e.clientY:false; var lixlpixel_tooltip = document.getElementByIdx(tooltip); lixlpixel_tooltip.style.left =(mousex+pagex+offsetx) + px; lixlpixel_tooltip.style.top =(mous

5、ey+pagey+offsety) + px; function tooltip(tip) if(!document.getElementByIdx(tooltip) newelement(tooltip); var lixlpixel_tooltip = document.getElementByIdx(tooltip); lixlpixel_tooltip.innerHTML = tip; lixlpixel_tooltip.style.display = block; document.onmousemove = getmouseposition; function exit() doc

6、ument.getElementByIdx(tooltip).style.display = none; test.html: html head style .tableBorder7width:800;solid; background-color: #000000; TDfont-family: 宋體;font-size: 12px;line-height : 15px ; thbackground-color: #f7f7f7;color: #000000;font-size: 12px;font-weight:bold; th.th1background-color: #333333; td.TableBody7background-color: #B1EA45; /style script language=JavaScript src=tooltips.js /script /HEAD BODY div onmouseover=tooltip