设计、建站、维护
始于2004年
当前位置:首页 > 网站制作

实现鼠标经过超链时的提示图层

发表日期:2009-3-17 作者来源:派谷网络 浏览次数:9204

〈html>
〈head>
〈script Language="JavaScript">
//***********默认设置定义.*********************
tPopWait=50;//停留tWait豪秒后显示提示。
tPopShow=5000;//显示tShow豪秒后关闭提示
showPopStep=20;
popOpacity=99;

//***************内部变量定义*****************
sPop=null;
curShow=null;
tFadeOut=null;
tFadeIn=null;
tFadeWaiting=null;

document.write("〈style type='text/css'id='defaultPopStyle'>");
document.write(".cPopText {  background-color: #F8F8F5;color:#000000; border: 1px #000000 solid;font-color: font-size: 12px; padding-right: 4px; padding-left: 4px; height: 20px; padding-top: 2px; padding-bottom: 2px; filter: Alpha(Opacity=0)}");
document.write("〈/style>");
document.write("〈div id='dypopLayer' style='position:absolute;z-index:1000;' class='cPopText'>〈/div>");


function showPopupText(){
var o=event.srcElement;
MouseX=event.x;
MouseY=event.y;
if(o.alt!=null && o.alt!=""){o.dypop=o.alt;o.alt=""};
        if(o.title!=null && o.title!=""){o.dypop=o.title;o.title=""};
if(o.dypop!=sPop) {
sPop=o.dypop;
clearTimeout(curShow);
clearTimeout(tFadeOut);
clearTimeout(tFadeIn);
clearTimeout(tFadeWaiting);
if(sPop==null || sPop=="") {
dypopLayer.innerHTML="";
dypopLayer.style.filter="Alpha()";
dypopLayer.filters.Alpha.opacity=0;
}
else {
if(o.dyclass!=null) popStyle=o.dyclass
else popStyle="cPopText";
curShow=setTimeout("showIt()",tPopWait);
}

}
}

function showIt(){
dypopLayer.className=popStyle;
dypopLayer.innerHTML=sPop;
popWidth=dypopLayer.clientWidth;
popHeight=dypopLayer.clientHeight;
if(MouseX+12+popWidth>document.body.clientWidth) popLeftAdjust=-popWidth-24
else popLeftAdjust=0;
if(MouseY+12+popHeight>document.body.clientHeight) popTopAdjust=-popHeight-24
else popTopAdjust=0;
dypopLayer.style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust;
dypopLayer.style.top=MouseY+12+document.body.scrollTop+popTopAdjust;
dypopLayer.style.filter="Alpha(Opacity=0)";
fadeOut();
}

function fadeOut(){
if(dypopLayer.filters.Alpha.opacity〈popOpacity) {
dypopLayer.filters.Alpha.opacity+=showPopStep;
tFadeOut=setTimeout("fadeOut()",1);
}
else {
dypopLayer.filters.Alpha.opacity=popOpacity;
tFadeWaiting=setTimeout("fadeIn()",tPopShow);
}
}

function fadeIn(){
if(dypopLayer.filters.Alpha.opacity>0) {
dypopLayer.filters.Alpha.opacity-=1;
tFadeIn=setTimeout("fadeIn()",1);
}
}
document.onmouseover=showPopupText;
〈/script>
〈/head>
〈BODY>
〈a href="#" title="我想请问斑竹?〈br>作者:农民〈br>发表于2002-6-3 20:17:16〈br>最后跟贴:呵呵,是住我们......">我想请问斑竹?〈/a>

接着前面的     
〈/body>

〈/html>

(注:再复制代码的时候请把"〈"标签改为英文下的“<”)

本文章系本站编辑转载,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权和其它问题,请与本站联系,我们将在第一时间删除内容!

相关网站设计案例

相关推荐新闻

移动网页设计中的注意事...

在移动网页设计中,为了给用户提供良好的体验,需要综合考虑多方...

日期:2025-3-24 浏览次数:60

建企业网站注意事项...

建设企业网站时,以下这些方面需要特别留意,以确保网站能够有效...

日期:2025-3-22 浏览次数:1116

网站制作中除了域名,还...

在网站制作里,除域名之外,还有诸多因素会对网站推广和品牌建设...

日期:2025-3-21 浏览次数:2063

响应式设计对于网站制作...

响应式设计是一种网站设计技术,可使网站在不同设备(如台式机、...

日期:2025-3-21 浏览次数:2021

网站制作需要注意有什么...

网站制作是一个综合性的工作,需要从多个方面进行考虑和规划,以...

日期:2025-3-21 浏览次数:1784

网站建设解决方案
  • 网站维护解决方案
  • 企业门户网站集约化解决方案
  • 营销型网站解决方案
  • 养老院行业网站建设解决方案
  • 医院诊所网站建设解决方案
  • 手机数码行业网站建设方案
  • 外贸公司网站建设解决方案
  • 金融网站建设解决方案
  • 行业协会类网站建设解决方案
  • 品牌官网网站建设方案