您的位置:首页 > 其它

鼠标移动出新文字

2015-07-31 17:26 183 查看
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY><script>
var c$={};
var w$=function(s){document.write(s);}
var o$=function(id){return document.getElementById(id);}
w$("<div id=\"ts\" style=\"position:absolute;background-color:#FFFFE6;font-size: 12px;padding: 3px;    border: 1px solid #FFCC99;display:none\"></div>");

c$.mmove=function(evt,o,s){
var evt=evt||window.event;
var x=evt.clientX+15;
var y=evt.clientY+20;
var bt=document.body.scrollTop;
var bl=document.body.scrollLeft;
x+=bl; y+=bt
o$("ts").style.left=x+"px";
o$("ts").style.top=y+"px";
if(s==""||typeof(s)=="undefined"){
o$("ts").innerHTML=o.innerHTML;
}else{
o$("ts").innerHTML=s
}
o$("ts").style.display="";
}

c$.mout=function(){
o$("ts").style.display="none";
}
//如果是图片,分开左右
c$.img=function(o){
if(o.src!="undefined"){
var x=o.offsetLeft;
var w=o.width;
w=w%2==0?w/2:(w+1)/2;
return [x,w];
}
return [];
}
c$.imgmove=function(evt,o,sl,sr){
var evt=evt||window.event;
var x=evt.clientX+15;
var y=evt.clientY+20;
var ar=c$.img(o);
var bt=document.body.scrollTop;
var bl=document.body.scrollLeft;
x+=bl; y+=bt
o$("ts").style.left=x+"px";
o$("ts").style.top=y+"px";
if(x<(ar[0]+ar[1])){
o$("ts").innerHTML=sl;
}else{
o$("ts").innerHTML=sr;
}
o$("ts").style.display="";
}
</script>

<p><a href="#" onmousemove="c$.mmove(event,this)" onmouseout="c$.mout();">aaaaaaaaa<br><font color=red>aaaaaaa></font></a></p>
<p><a href="#" onmousemove="c$.mmove(event,this,'哈哈')" onmouseout="c$.mout();">bbbbbbbbbbb</a></p>
<p><a href="#" onmousemove="c$.mmove(event,this)" onmouseout="c$.mout();">cccccccccccc</a></p>
<p><a href="#" onmousemove="c$.mmove(event,this)" onmouseout="c$.mout();">dddddddddddd</a></p>
<p><img src="http://bbs.blueidea.com/images/default/logo.gif" onmousemove="c$.imgmove(event,this,'<font color=red>这是图片左半部分</font>','<font color=blue>这是图片右半部分</font>')" onmouseout="c$.mout();">></p>
<p><a href="#" onmousemove="c$.mmove(event,this)" onmouseout="c$.mout();">eeeeeeeeeeeee</a></p>
<p><img src="http://news.beelink.com.cn/20050404/beelink20050404zh10.jpg" onmousemove="c$.imgmove(event,this,'<font color=red>这是图片左半部分</font>','<font color=blue>这是图片右半部分</font>')" onmouseout="c$.mout();">></p>    <p><a href="#" onmousemove="c$.mmove(event,this)" onmouseout="c$.mout();">想做个特效就是移到文字上面或是图片上面出现提示,title能够定义属性吗?如换行,文字色彩等<br />
<br />
在坛内看到一个移<span><font color=blue>到小图片上出现大图片的效果,效果不错</font></span>,感觉挺复杂,不知道有没有更简单一点的。
</a></p>
<p><a href="#" onmousemove="c$.mmove(event,this)" onmouseout="c$.mout();">ggggggggggggggggggggggggggg</a></p>
<p><a href="#" onmousemove="c$.mmove(event,this)" onmouseout="c$.mout();">hhhhhhhhhhhhhhhhhhhhhhhhh</a></p>
<p><a href="#" onmousemove="c$.mmove(event,this)" onmouseout="c$.mout();">想做个特效就是移到文字上面或是图片上面出现提示,title能够定义属性吗?如换行,文字色彩等<br />
<br />
在坛内看到一个移<span><font color="#CC0000">到小图片上出现大图片的效果,效果不错</font></span>,感觉挺复杂,不知道有没有更简单一点的。
</a></p>
</BODY>
</HTML>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: