»
Tiếng AnhTiếng PhápTiếng Việt

In - Ảnh di chuyển trong chữ - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Chữ » Ảnh di chuyển trong chữ
URL: http://www.javascriptbank.com/lettermovie-index.html

Ảnh di chuyển trong chữ © JavaScriptBank.comHiệu ứng tạo ra một ảnh làm nền cho chữ và ảnh này di chuyển theo chiều từ phải sang trái.

Phiên bản đầy đủ: jsB@nk » Chữ » Ảnh di chuyển trong chữ
URL: http://www.javascriptbank.com/lettermovie-index.html



CSS
<style type="text/css">.textstyle{position:absolute;left:-2000px;}A{color:000000;}.bgdivstyle{position:absolute;left:-2000px;}</STYLE><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<SCRIPT LANGUAGE="JavaScript"><!-- Beginning of JavaScript -// CREDITS:// LetterMovie by Urs Dudli and Peter Gehrig // Copyright (c) 2000 Peter Gehrig and Urs Dudli. All rights reserved.// Edit the variables below:// URLs of the messageboard-images// you may add as many messageboard-images as you like. They must have all the same sizevar messageboard = new Array()messageboard[0]="messageboard1.gif"// URL of the background-images// It must have the same height as the messageboard-imagesvar bgimage="bgsky66.jpg"// width of messageboard-images (pixels)var messageboardheight=205// distance of the messageboard-images to the left margin of the document (pixels)var messageboardwidth=377// width of the background-image. It should as wide as the messageboard-image or widervar bgdivwidth=1200// distance of the messageboard-images to the top margin of the document (pixels)var messageboardtop=10// distance of the messageboard-images to the left margin of the document (pixels)var messageboardleft=10// do not edit the variables belowvar i_messageboard=0// the speed of the animation. The smaller the value the slower the speed.var step=10var imgpreload=new Array()for (i=0;i<=messageboard.length-1;i++) {imgpreload[i]=new Image()imgpreload[i].src=messageboard[i]}var bgimgpreload=new Image()bgimgpreload.src=bgimagevar bgdivtop=messageboardtopvar bgdivleft=messageboardleftvar bgdivheight=messageboardheightvar cliptop=0var clipright=messageboardwidthvar clipbottom=bgdivheightvar clipleft=0var clippointsvar contentbg=""var pause=50var timerfunction init() {clipleft=0clipright=messageboardwidthcontentbg="<table cellpadding=0 cellspacing=0 border=0><tr>"contentbg+="<td><img src='"+bgimage+"' border='0' width='"+bgdivwidth+"' height='"+messageboardheight+"'></td>"contentbg+="<td><img src='"+bgimage+"' border='0' width='"+bgdivwidth+"' height='"+messageboardheight+"'></td>"contentbg+="<td><img src='"+bgimage+"' border='0' width='"+bgdivwidth+"' height='"+messageboardheight+"'></td>"contentbg+="</tr></table>"    if (document.all) {bgdiv.innerHTML=contentbgtext.innerHTML="<img src='"+messageboard[0]+"' border='0' width='"+messageboardwidth+"' height='"+messageboardheight+"'>"    document.all.text.style.posTop=messageboardtop        document.all.text.style.posLeft=messageboardleft        document.all.bgdiv.style.posTop=bgdivtop        document.all.bgdiv.style.posLeft=bgdivleft        movebackground()    }if (document.layers) {document.bgdiv.document.write(contentbg) document.bgdiv.document.close() document.text.document.write("<img src='"+messageboard[i]+"' border='0' width='"+messageboardwidth+"' height='"+messageboardheight+"'>") document.text.document.close()     document.text.top=messageboardtop        document.text.left=messageboardleft        document.bgdiv.top=bgdivtop        document.bgdiv.left=bgdivleft         movebackground()    }}function restart() {clipleft=0clipright=messageboardwidth    if (document.all) {        document.all.bgdiv.style.posLeft=bgdivleft    }if (document.layers) {        document.bgdiv.left=bgdivleft             }movebackground()}function movebackground() {if (document.all) {    if (document.all.bgdiv.style.posLeft >=(-bgdivwidth+messageboardwidth+bgdivleft+step)) {           clipleft+=step        clipright=clipleft+messageboardwidth        clippoints="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"document.all.bgdiv.style.clip=clippoints        document.all.bgdiv.style.posLeft-=step        timer= setTimeout("movebackground()",pause)    }    else {        clearTimeout(timer)        i_messageboard++        if (i_messageboard>=messageboard.length) {i_messageboard=0}        text.innerHTML="<img src='"+messageboard[i_messageboard]+"' border=0>"        restart()    }}if (document.layers) {if (document.bgdiv.left >=(-bgdivwidth+messageboardwidth+bgdivleft+step-22)) {           clipleft+=step        clipright=clipleft+messageboardwidthdocument.bgdiv.clip.top=cliptopdocument.bgdiv.clip.left=clipleftdocument.bgdiv.clip.bottom=clipbottomdocument.bgdiv.clip.right=clipright        document.bgdiv.left-=step        timer= setTimeout("movebackground()",pause)    }    else {        clearTimeout(timer)        i_messageboard++        if (i_messageboard>=messageboard.length) {i_messageboard=0}        document.text.document.write("<img src='"+messageboard[i_messageboard]+"' border=0>") document.text.document.close()          restart()    }}}// - End of JavaScript - --></SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<BODY style="width:100%;overflow-x:hidden;overflow-y:scroll" onLoad="init()"><DIV ID="bgdiv" class="bgdivstyle"></DIV><DIV ID="text" class="textstyle"></DIV></BODY> <!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->