1顶

提示信息的打字效果

稿源：互联网 2022-05-19 00:18:40 点击： 814 撤稿纠错

鼠标经过弹出提示信息，文字逐一跳出，很像打字效果。

以下讨论的是和特效相关的提示信息的打字效果教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

// CREDITS:
// PopupTicker describing all your links onmouseover by Urs Dudli and Peter Gehrig 
// Copyright (c) 2000 Peter Gehrig and Urs Dudli. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// Additional scripts can be found at http://www.24fun.com.
// info@24fun.ch
// 8/1/2000

// IMPORTANT: 
// If you add this script to a script-library or a script-archive 
// you have to insert a link to http://www.24fun.com right into the webpage where the script
// will be displayed.

// CONFIGURATION:
// Go to http://www.24fun.com, open category 'text' and download the ZIP-file of this script 
// containing the the script-file with step-by-step instructions for easy configuration.

// width of the ticker
var tickerwidth=120

// height of the ticker
var tickerheight=100

// distance from the messagetext to the tickermarrgin (pixels)
var tickerpadding=5

// borderwidth of the ticker (pixels)
var borderwidth=2

// font-family
var fnt="Verdana"

// font-size of the text
var fntsize=8

// font-size of the last letter of the ticker
var fntsizelastletter=8

// font-color of the text
var fntcolor="008800"

// font-color of the last letter of the ticker
var fntcolorlastletter="00AA00"

// font-weight. Set a value between 1 to 9 to adjust the boldness
var fntweight=3

// backgroundcolor
var backgroundcolor="CCFFCC"

// standstill between the messages (microseconds)
var standstill=2000

// speed (a higher value will slow down the ticker)
var speed=40

// horizontal distance from the textlink to the popupbox (pixels)
var xdistance=50

// vertical distance from the textlink to the popupbox (pixels)
var ydistance=20

// Do not edit the variables below
var timer
var topposition=0
var leftposition=0
var x,y
var i_substring=0
var i_presubstring=0
var i_message=0
var message
var messagecontent=""
var messagebackground=""
var messagepresubstring=""
var messageaftersubstring=""
fntweight=fntweight*100

function getmessagebackground() {
        messagebackground="<table border="+borderwidth+" width="+tickerwidth+" height="+tickerheight+" cellspacing=0 cellpadding=0><tr><td valign=top bgcolor='"+backgroundcolor+"'>"
        messagebackground+=" </td></tr></table>"
}

function getmessagecontent() {    
        messagecontent="<table border=0 cellspacing=0 cellpadding="+tickerpadding+" width="+tickerwidth+" height="+tickerheight+"><tr><td valign=top>"
        messagecontent+="<span style='position:relative; font-family:"+fnt+";color:"+fntcolor+";font-size:"+fntsize+"pt;font-weight:"+fntweight+"'>"    
        messagecontent+="<font color='"+fntcolor+"'>"
        messagecontent+=messagepresubstring
        messagecontent+="</font>"
        messagecontent+="</span>"
        messagecontent+="<span style='position:relative; font-family:"+fnt+";color:"+fntcolor+";font-size:"+fntsizelastletter+"pt;font-weight:900'>"    
        messagecontent+="<font color='"+fntcolorlastletter+"'>"
        messagecontent+=messageaftersubstring
        messagecontent+="</font>"
        messagecontent+="</span>"
        messagecontent+="</td></tr></table>"
}

function showticker() {
    if (i_substring<=message.length-1) {
            i_substring++
            i_presubstring=i_substring-1
            if (i_presubstring<0) {i_presubstring=0}
            messagepresubstring=message.substring(0,i_presubstring)
            messageaftersubstring=message.substring(i_presubstring,i_substring)
            getmessagecontent()
        if (document.all) {
            ticker.innerHTML=messagecontent
            timer=setTimeout("showticker()", speed)
        }
        if (document.layers) {
            document.ticker.document.write(messagecontent)
            document.ticker.document.close()
            timer=setTimeout("showticker()", speed)
        }
    }
    else {
        clearTimeout(timer)
    }
}

function hideticker() {
    clearTimeout(timer)
    i_substring=0
    i_presubstring=0
    if (document.all) {
        document.all.ticker.style.visibility="hidden"
        document.all.tickerbg.style.visibility="hidden"
    }
    if (document.layers) {
        document.ticker.visibility="hidden"
        document.tickerbg.visibility="hidden"
    }
}

function showmessage(linkmessage) {
    getmessagebackground()
    message=linkmessage
   
    i_substring=0
    i_presubstring=0
    leftposition=x+xdistance
    topposition=y+ydistance
    if (document.all) {    
        document.all.ticker.style.posLeft=leftposition
        document.all.ticker.style.posTop=topposition
        document.all.tickerbg.style.posLeft=leftposition
        document.all.tickerbg.style.posTop=topposition
        tickerbg.innerHTML=messagebackground
        document.all.ticker.style.visibility="visible"
        document.all.tickerbg.style.visibility="visible"
        showticker()
    }
    if (document.layers) {
        document.ticker.left=leftposition
        document.ticker.top=topposition
        document.tickerbg.left=leftposition
        document.tickerbg.top=topposition
        document.tickerbg.document.write(messagebackground)
        document.tickerbg.document.close()
        document.ticker.visibility="visible"
        document.tickerbg.visibility="visible"
        showticker()
    }
}

function handlerMM(e){
    x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX
    y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY
}

if (document.layers){
    document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = handlerMM;

// - End of JavaScript - -->
</script>

</head>
<body>
<DIV ID="tickerbg" style="position:absolute;"></DIV>
<DIV ID="ticker" style="position:absolute;"></DIV>

</body></html>

<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

关于提示信息的打字效果的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/200807162665.shtml方便下次再访问哦。

·上一篇： 网页十字显现
·下一篇： 鼠标经过变色效果

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

提示信息的打字效果

文章分类LIST >>返回首页

最新游戏

最新新闻