Home  >  Article  >  Web Front-end  >  js鼠标移动在title中显示图片的效果代码_图象特效

js鼠标移动在title中显示图片的效果代码_图象特效

WBOY
WBOYOriginal
2016-05-16 18:40:561338browse

1.js代码

复制代码 代码如下:

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

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

document.write("");
document.write("
");


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        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;

2.html代码包含js代码即可,使用范例
具体的看脚本之家给出的测试代码。
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn