JavaScript：获取网页标签的 alt 或 title 属性的值并自定义显示 V2.0_

JavaScript：获取网页标签的 alt 或 title 属性的值并自定义显示 V2.0

<!--

document.write("<div id='GuAltTitleLayer' style='width:auto;height:auto;border:1px #525252 solid;background:#FFFFB3;padding:2px 4px 2px 4px;font-family:Verdana,Arial,宋体;font-size:12px;color:#000000;text-align:left;position:absolute;z-index:600;display:none;'></div>");

function GuAltTitleShow(event) {
	event=event||window.event;
	var GuTarget=event.srcElement?event.srcElement:event.target;

if ((GuTarget.alt!="")&&(GuTarget.alt!=null)) {
		GuTarget.AltTitleNote=GuTarget.alt;
		GuTarget.alt="";
		}
	if ((GuTarget.title!="")&&(GuTarget.title!=null)) {
		GuTarget.AltTitleNote=GuTarget.title;
		GuTarget.title="";
		}
	if ((GuTarget.AltTitleNote!="")&&(GuTarget.AltTitleNote!=null)) {
		GuElementGet("GuAltTitleLayer").style.display="";
		GuElementGet("GuAltTitleLayer").innerHTML=GuTarget.AltTitleNote;
		GuAltTitleWidth=GuElementGet("GuAltTitleLayer").clientWidth;
		GuAltTitleHeight=GuElementGet("GuAltTitleLayer").clientHeight;

if (GuAltTitleWidth>=600) {
			GuAltTitleWidth=600;
			}

if ((event.clientY+20+GuAltTitleHeight)>(document.body.clientHeight)) {
			GuAltTitleTop=-GuAltTitleHeight-40;
			}
		else {
			GuAltTitleTop=0;
			}

if ((event.clientX+10+GuAltTitleWidth)>(document.body.clientWidth)) {
			GuAltTitleLeft=-GuAltTitleWidth-20;
			}
		else {
			GuAltTitleLeft=0;
			}

if ((event.clientX)||(event.clientY)) {
			if ((document.body.scrollTop)||(document.body.scrollLeft)) {
				GuAltTitleTop=(event.clientY)+20+(document.body.scrollTop)+GuAltTitleTop;
				GuAltTitleLeft=(event.clientX)+10+(document.body.scrollLeft)+GuAltTitleLeft;
				}
			else {
				GuAltTitleTop=(event.clientY)+20+(document.documentElement.scrollTop)+GuAltTitleTop;
				GuAltTitleLeft=(event.clientX)+10+(document.documentElement.scrollLeft)+GuAltTitleLeft;
				}
			}
		else {
			GuAltTitleTop=(event.pageY)+20+GuAltTitleTop;
			GuAltTitleLeft=(event.pageX)+10+GuAltTitleLeft;
			}

if (GuAltTitleTop<=0) {
			GuAltTitleTop=0;
			}

if (GuAltTitleLeft<=0) {
			GuAltTitleLeft=0;
			}

GuElementGet("GuAltTitleLayer").style.top=GuAltTitleTop+"px";
		GuElementGet("GuAltTitleLayer").style.left=GuAltTitleLeft+"px";
		}
	else {
		GuElementGet("GuAltTitleLayer").style.display="none";
		GuElementGet("GuAltTitleLayer").innerHTML="";
		}
	}

document.onmouseover=GuAltTitleShow;

//-->

程序说明：
1、将鼠标指标移至文字或图片上，即可出现提示信息。鼠标离开后提示框自动消失。
2、在 Google Chrome 4.0，Opera 11.0，Mozilla Firefox 3.6，Windows Internet Explorer 8.0 测试通过。
3、支持获取所有的网页标签的 alt 或 title 的属性。
4、支持在 alt 或 title 的值中使用
或
进行换行，如果内容较多，也会自动换行。
5、提示框靠近顶部、左边界或右边界时，程序自动调整，不会没入顶部、左边界或右边界。
6、若要提示框能跟随鼠标移动，修改 AltTitle.js 中的第 92 行 document.onmouseover=GuAltTitleShow; 为 document.onmousemove=GuAltTitleShow;
7、若要修改提示框的边框、背景颜色、字体，修改 AltTitle.js 中的第 22 行的代码。
8、复制 AltTitle.js 到你的网站目录中，并在需要调用的网页代码中加入即可。

〖演示页面〗〖下载页面〗

文章作者：啊估整理