首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

兼容IE,火狐狸的自定义tips,浮动显示文字

2012-10-24 
兼容IE,火狐的自定义tips,浮动显示文字大部分代码来自网络,可以在自己的页面定义变量qTipTag名称譬如想遍

兼容IE,火狐的自定义tips,浮动显示文字

大部分代码来自网络,可以在自己的页面定义变量qTipTag名称譬如想遍历全部的TD 就写qTipTag='td';,

我还加了个qTipClassName用于却分是否需要做tips处理,只有定义指定class的tag才做。

?

//////////////////////////////////////////////////////////////////// qTip - CSS Tool Tips - by Craig Erskine// http://qrayg.com | http://solardreamstudios.com//// Inspired by code from Travis Beckham// http://www.squidfingers.com | http://www.podlob.com//////////////////////////////////////////////////////////////////var qTipTag = "td"; // Which tag do you want to qTip-ize? Keep it lowercase!//var qTipX = -30; // This is qTip's X offset//var qTipY = 25; // This is qTip's Y offset//var qTipClassName = "needShowPop"; // Which objects' name.// There's No need to edit anything below this line//tooltip = {name :"qTip",offsetX :qTipX,offsetY :qTipY,tip :null}tooltip.init = function() {try{var tipNameSpaceURI = "http://www.w3.org/1999/xhtml";if (!tipContainerID) {var tipContainerID = "qTip";}var tipContainer = document.getElementById(tipContainerID);if (!tipContainer) {tipContainer = document.createElementNS ? document.createElementNS(tipNameSpaceURI, "div") : document.createElement("div");tipContainer.setAttribute("id", tipContainerID);document.getElementsByTagName("body").item(0).appendChild(tipContainer);}if (!document.getElementById)return;this.tip = document.getElementById(this.name);if (this.tip)document.onmousemove = function(evt) {tooltip.move(evt||window.event)};var a, sTitle;var anchors = document.getElementsByTagName(qTipTag); for ( var i = 0; i < anchors.length; i++) {a = anchors[i];if(a.getAttribute("type") != qTipClassName){continue;}sTitle = a.getAttribute("title");if (sTitle) {a.setAttribute("tiptitle", sTitle);a.removeAttribute("title");a.onmouseover = function() {tooltip.show(this.getAttribute('tiptitle'))};a.onmouseout = function() {tooltip.hide()};}}}catch(e){//alert(e)}}tooltip.move = function(evt) {try{var x = 0, y = 0;if (document.all) {// IEx = (document.documentElement && document.documentElement.scrollLeft) ? document.documentElement.scrollLeft: document.body.scrollLeft;y = (document.documentElement && document.documentElement.scrollTop) ? document.documentElement.scrollTop: document.body.scrollTop;x += window.event.clientX;y += window.event.clientY;} else {// Good Browsersx = evt.pageX;y = evt.pageY;}var divWidth = document.getElementById("qTip").scrollWidth;var divHeight = document.getElementById("qTip").scrollHeight;if (x + divWidth > document.body.clientWidth + document.body.scrollLeft + qTipX) {x = x - divWidth;}if (y + divHeight > document.body.clientHeight + document.body.scrollTop - qTipY) {y = y - divHeight - qTipY;}this.tip.style.left = (x + this.offsetX) + "px";this.tip.style.top = (y + this.offsetY) + "px";}catch(e){//alert(e)}}tooltip.show = function(text) {if (!this.tip)return;this.tip.innerHTML = text;this.tip.style.display = "block";}tooltip.hide = function() {if (!this.tip)return;this.tip.innerHTML = "";this.tip.style.display = "none";}

?

朋友的网站 http://woods2010.cn.alibaba.com/?专业电子器件代购

热点排行