Phiên bản đầy đủ: jsB@nk » Liên kết » Chú thích » Liên kết có ảnh và hộp thoại chú thích
URL: https://www.javascriptbank.com/the-return-of-borderman.html
Hiệu ứng tạo ra hình ảnh và hộp thoại cùng chú thích cho liên kết khi ta rê con trỏ chuột đến, đầu tiên các hình ảnh sẽ di chuyển từ bên trái trang web ra cho đến khi gặp liên kết thì dừng lại rồi tiềp đó hộp thoại sẽ xuất hiện rồi sau đó ảnh sẽ di chuyển tiếp.
Phiên bản đầy đủ: jsB@nk » Liên kết » Chú thích » Liên kết có ảnh và hộp thoại chú thích
URL: https://www.javascriptbank.com/the-return-of-borderman.html
<script><!-- Beginning of JavaScript -// CONFIGURATION:// with step-by-step instructions for easy configuration.// width of the ticker (pixels)var tickerwidth=120// height of the ticker (pixels)var tickerheight=100// distance from the messagetext to the tickermargin (pixels)var tickerpadding=5// borderwidth of the ticker (pixels)var borderwidth=2// font-familyvar fnt="Verdana"// font-size of the textvar fntsize=10// font-color of the textvar fntcolor="FFFFFF"// font-weight. Set a value between 1 to 9 to adjust the boldnessvar fntweight=9// backgroundcolorvar backgroundcolor="FF0000"// The length of each step of the walking borderman (pixels)var anistep=15// The pause between each step of the walking borderman (milliseconds)var anipause=80// Do not edit the variables belowvar max_ani=4var aniwidth=54var aniheight=54var x_posani=0var y_posani=0var x_posflower=0var y_posflower=0var screenwidthvar screenheightvar thisanivar i_ani=1var xrangevar x=100var y=0var timer,timerboxvar message=" "var messagecontent=" "var clipleft=0var clipright=tickerwidthvar cliptop=0var clipbottom=0fntweight=100*fntweightfunction getmessagecontent() {messagecontent="<table cellspacing=0 cellpadding="+tickerpadding+" width="+tickerwidth+" height="+tickerheight+" border="+borderwidth+"><tr><td valign=top bgcolor="+backgroundcolor+">"messagecontent+="<span style='position:relative; font-family:"+fnt+";color:"+fntcolor+";font-size:"+fntsize+"pt;font-weight:"+fntweight+"'>"messagecontent+="<font color='"+fntcolor+"'>"messagecontent+=messagemessagecontent+="</font>"messagecontent+="</span>"messagecontent+="</td></tr></table>"}function initiate(thismessage) {clearTimeout(timer)clearTimeout(timerbox)clipbottom=0message=thismessagegetmessagecontent()if (document.all) {flower.innerHTML=messagecontent screenwidth=document.body.clientWidth y_posani=y-30 x_posani=0 document.all.bottom1.style.posLeft=x_posani document.all.bottom1.style.posTop=y_posani thisani=eval("document.all.left"+i_ani+".style")}if (document.layers) {document.flower.document.write(messagecontent)document.flower.document.close()screenwidth=window.innerWidth y_posani=y-30 x_posani=0 document.bottom1.left=x_posani document.bottom1.top=y_posani thisani=eval("document.left"+i_ani)}movebottom1()}function stopanimation() {clearTimeout(timer)clearTimeout(timerbox)clipbottom=0if (document.all) {thisani.posLeft=-1000document.all.manurinating.style.posLeft=-1000document.all.flower.style.posLeft=-1000}if (document.layers) {document.manurinating.left=-1000document.flower.left=-1000document.bottom1.left=-1000document.bottom2.left=-1000document.bottom3.left=-1000document.bottom4.left=-1000document.right1.left=-1000document.right2.left=-1000document.right3.left=-1000document.right4.left=-1000document.top1.left=-1000document.top2.left=-1000document.top3.left=-1000document.top4.left=-1000document.left1.left=-1000document.left2.left=-1000document.left3.left=-1000document.left4.left=-1000}}function movebottom1() {if (x_posani<x-aniwidth) {x_posani+=anistepif (document.all) { thisani.posLeft=-2000 thisani=eval("document.all.bottom"+i_ani+".style")thisani.posLeft=x_posanithisani.posTop=y_posani}if (document.layers) {thisani.left=-2000 thisani=eval("document.bottom"+i_ani)thisani.left=x_posanithisani.top=y_posani} i_ani++ if (i_ani>max_ani) {i_ani=1}timer=setTimeout("movebottom1()",anipause)}else {clearTimeout(timer)x_posani-=anistepshowurinator()}}function showurinator() {if (document.all) {thisani.posLeft=-2000manurinate.src="../image/logojs.gif" document.all.manurinating.style.posLeft=x_posani document.all.manurinating.style.posTop=y_posani}if (document.layers) {thisani.left=-2000document.manurinating.document.manurinate.src="manurinating.gif" document.manurinating.left=x_posani document.manurinating.top=y_posani}timer=setTimeout("hideurinator()",2000)}function hideurinator() {if (document.all) { document.all.manurinating.style.posLeft=-2000document.all.flower.style.posLeft=x-10 document.all.flower.style.posTop=y-10document.all.flower.style.zIndex=100}if (document.layers) { document.manurinating.left=-2000document.flower.left=x-10 document.flower.top=y-10document.flower.zIndex=100}upmessagebox()movebottom2()}function upmessagebox() {if (clipbottom<=tickerheight) {clipbottom+=2if (document.all) { document.all.flower.style.posTop-=2document.all.flower.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"}if (document.layers) {document.flower.top-=2document.flower.clip.top=cliptopdocument.flower.clip.bottom=clipbottomdocument.flower.clip.left=clipleftdocument.flower.clip.right=clipright}timerbox=setTimeout("upmessagebox()",50)}else {clearTimeout(timerbox)var timerdown=setTimeout("downmessagebox()",1000)}}function downmessagebox() {if (clipbottom>=0) {clipbottom-=2if (document.all) { document.all.flower.style.posTop+=2document.all.flower.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"}if (document.layers) {document.flower.top+=2document.flower.clip.top=cliptopdocument.flower.clip.bottom=clipbottomdocument.flower.clip.left=clipleftdocument.flower.clip.right=clipright}timerbox=setTimeout("downmessagebox()",50)}else {clearTimeout(timerbox)}}function movebottom2() {if (x_posani<screenwidth-aniheight) {x_posani+=anistepif (document.all) { thisani.posLeft=-2000 thisani=eval("document.all.bottom"+i_ani+".style")thisani.posLeft=x_posanithisani.posTop=y_posani}if (document.layers) {thisani.left=-2000 thisani=eval("document.bottom"+i_ani)thisani.left=x_posanithisani.top=y_posani} i_ani++ if (i_ani>max_ani) {i_ani=1}timer=setTimeout("movebottom2()",anipause)}else {clearTimeout(timer)x_posani-=anistepmoveright()}}function moveright() {if (y_posani>0) {y_posani-=anistepif (document.all) { thisani.posLeft=-2000 thisani=eval("document.all.right"+i_ani+".style")thisani.posLeft=x_posanithisani.posTop=y_posani}if (document.layers) {thisani.left=-2000 thisani=eval("document.right"+i_ani)thisani.left=x_posanithisani.top=y_posani} i_ani++ if (i_ani>max_ani) {i_ani=1}timer=setTimeout("moveright()",anipause)}else {clearTimeout(timer)y_posani+=anistep/2movetop()}}function movetop() {if (x_posani>0) {x_posani-=anistepif (document.all) { thisani.posLeft=-2000 thisani=eval("document.all.top"+i_ani+".style")thisani.posLeft=x_posanithisani.posTop=y_posani}if (document.layers) {thisani.left=-2000 thisani=eval("document.top"+i_ani)thisani.left=x_posanithisani.top=y_posani} i_ani++ if (i_ani>max_ani) {i_ani=1}var timer=setTimeout("movetop()",anipause)}else {clearTimeout(timer)stopanimation()}}function handlerMM(e){x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientXy = (document.layers) ? e.pageY : document.body.scrollTop+event.clientYflag=1}if (document.layers){document.captureEvents(Event.MOUSEMOVE);}document.onmousemove = handlerMM;// - End of JavaScript - --></script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><a href="#" onMouseOver="initiate('I hate red textlinks!')" onMouseOut="stopanimation()"><b>red textlink</b></a><DIV id="bottom1" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logojs.gif" border=0 width="150" height="60"></A></DIV><DIV id="bottom2" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logojs.gif" border=0 width="150" height="60"></A></DIV><DIV id="bottom3" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logocuoi.gif" border=0 width="150" height="60"></A></DIV><DIV id="bottom4" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logojs.gif" border=0 width="150" height="60"></A></DIV><DIV id="right1" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logocuoi.gif" border=0 width="150" height="60"></A></DIV><DIV id="right2" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logojs.gif" border=0 width="150" height="60"></A></DIV><DIV id="right3" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logocuoi.gif" border=0 width="150" height="60"></A></DIV><DIV id="right4" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logojs.gif" border=0 width="150" height="60"></A></DIV><DIV id="top1" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logocuoi.gif" border=0 width="150" height="60"></A></DIV><DIV id="top2" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logojs.gif" border=0 width="150" height="60"></A></DIV><DIV id="top3" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logocuoi.gif" border=0 width="150" height="60"></A></DIV><DIV id="top4" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logojs.gif" border=0 width="150" height="60"></A></DIV><DIV id="left1" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logocuoi.gif" border=0 width="150" height="60"></A></DIV><DIV id="left2" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logojs.gif" border=0 width="150" height="60"></A></DIV><DIV id="left3" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logocuoi.gif" border=0 width="150" height="60"></A></DIV><DIV id="left4" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logojs.gif" border=0 width="150" height="60"></A></DIV><DIV id="flower" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG SRC="../image/logocuoi.gif" border=0 width="150" height="60"></A></DIV><DIV id="manurinating" style="position:absolute;left:-5000px;"><a href="http://jsbank.topcities.com" target="_blank"><IMG name="manurinate" SRC="../image/logojs.gif" border=0 width="150" height="60"></A></DIV><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->