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

In - Hiển thị hộp thoại chứa liên kết - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Hiển thị hộp thoại chứa liên kết
URL: https://www.javascriptbank.com/simple-newsscroller-with-highly-configurable-dissolving-effect.html

Hiển thị hộp thoại chứa liên kết © JavaScriptBank.comMột hộp thoại chứa các liên kết được hiển thị bằng cách phân rã màu nền theo từng mảng để cho liên kết mới xuất hiện, các liên kết trong hộp thoại sẽ đổi màu từng kí tự khi bạn rê con trỏ chuột đến.

Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Hiển thị hộp thoại chứa liên kết
URL: https://www.javascriptbank.com/simple-newsscroller-with-highly-configurable-dissolving-effect.html



CSS
<STYLE>A {COLOR: white; TEXT-DECORATION: none}A:hover {COLOR: red; TEXT-DECORATION: none}.messagebox {BACKGROUND-COLOR: black; BORDER-BOTTOM: white 5px solid; BORDER-LEFT: white 5px solid; BORDER-RIGHT: white 5px solid; BORDER-TOP: white 5px solid; COLOR: white; FONT-FAMILY: Verdana; FONT-SIZE: 10pt; FONT-WEIGHT: bold; HEIGHT: 50px; PADDING-BOTTOM: 5px; PADDING-LEFT: 5px; PADDING-RIGHT: 5px; PADDING-TOP: 5px; POSITION: absolute; TEXT-ALIGN: center; WIDTH: 240px}.messageboxNN {BORDER-BOTTOM-COLOR: white; BORDER-LEFT-COLOR: white; BORDER-RIGHT-COLOR: white; BORDER-TOP-COLOR: white; COLOR: white; FONT-FAMILY: Verdana; FONT-SIZE: 10pt; FONT-WEIGHT: bold; POSITION: relative}</STYLE><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<SCRIPT><!-- Beginning of JavaScript -// Newsscroller with highly configurable dissolving effect// CONFIGURATION:// 1. Copy the two script-blocks:// Paste the first script-block inside the head-section of your HTML-file.//Insert the second script-block into the body-section.// 2. Copy the style-block and paste it into the head-section of your HTML-file//Configure the style-block by trial and error.// 3. Insert 'onLoad="checkbrowser()"' into the body-tag.// 4. Configure the variables below:// The width of your messagebox (pixels)// Be sure that the width-value inside the style-block (below the script-block )// is a few pixels smaller.var textwidth=260// The height of your messagebox (pixels)// Be sure that the height-value inside the style-block (below the script-block) // is a few pixels smaller.var textheight=60// Your messages. You may add as many messages as you like.var message=new Array()message[0]="WELCOME TO OUR DHTML FUNZONE"message[1]="ENJOY OUR SCRIPT-PRESENTATION"message[2]="DOWNLOAD OUR SCRIPTS RIGHT NOW"message[3]="AND ADD THEM TO YOUR WEBSITE"// Where should the messages above be linked to? // Add an URL for each message.// If you don't want to add an URL just write '#' instead of // the URL, see sample messageurl[2].var messageurl=new Array()messageurl[0]="http://javascriptbank.com"messageurl[1]="http://javascriptbank.com"messageurl[2]="#"messageurl[3]="http://javascriptbank.com"// The background-color for each message.var messagebg=new Array()messagebg[0]="880000"messagebg[1]="008800"messagebg[2]="000088"messagebg[3]="660066"// Final horizontal position of the messagebox: distance to the left margin of the windowvar x_finalpos=20// Final vertical position of the messagebox: distance to the top margin of the windowvar y_finalpos=20// Configure the number of vertical slices.// A high value will slow down the visual effect.var x_slices=30// Configure the number of horizontal slices.// A high value will slow down the visual effect.var y_slices=1// Standstill between the messages (microseconds)var pause=2500// Do not change the variables belowvar xy_slices=x_slices*y_slicesvar randomorder=new Array()for (i=0;i<=xy_slices-1;i++) {randomorder[i]=i}var speed=10var i_messages=0var width_slice=Math.floor(textwidth/x_slices)var height_slice=Math.floor(textheight/y_slices)var cliptop=0var clipbottom=height_slicevar clipleft=0var clipright=width_slicevar spancounter=0var x_random=new Array()var y_random=new Array()function checkbrowser() {if (document.all) {        initiate()    }    if (document.layers) {        rotatenetscape()    }}function initiate() {    if (document.all) {        spancounter=0     for (i=0;i<=y_slices-1;i++) {for (ii=0;ii<=x_slices-1;ii++) {var thisspan=eval("document.all.span"+spancounter+".style")thisspan.posLeft=x_finalposthisspan.posTop=y_finalpos                thisspan.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"clipleft+=width_slice        clipright+=width_slice        spancounter++}        clipleft=0        clipright=width_slice        cliptop+=height_slice        clipbottom+=height_slice}for (i=0;i<=xy_slices-1;i++) {var thisspan=eval("span"+i)thisspan.innerHTML="<a href='"+messageurl[i_messages]+"' target='_blank'>"+message[i_messages]+"</a>"}var timer=setTimeout("changemessage()",pause)   }}function dissolvemessage() {if (i_loop<=xy_slices-1) {var thisspan=eval("span"+randomorder[i_loop])thisspan.innerHTML="<a href='"+messageurl[i_messages]+"' target='_blank'>"+message[i_messages]+"</a>"thisspan.style.backgroundColor=messagebg[i_messages]i_loop++var timer=setTimeout("dissolvemessage()",speed)}else {clearTimeout(timer)var timer=setTimeout("changemessage()",pause)}}function changemessage() {getrandomorder(xy_slices)i_loop=0i_messages++if (i_messages>=message.length) {i_messages=0}   dissolvemessage()}function getrandomorder(range) {for (i=0;i<=range;i++) {var firstvalue= Math.floor(range*Math.random())var secondvalue= Math.floor(range*Math.random())var cachevalue=randomorder[firstvalue]randomorder[firstvalue]=randomorder[secondvalue]randomorder[secondvalue]=cachevalue}}function rotatenetscape() {document.imgcontainer1.document.write("<table width="+textwidth+" height="+textheight+"><tr><td bgcolor="+messagebg[i_messages]+" cellpadding=2 cellspacing=2 align=center><span id='imgcontainer2' class='messageboxNN'><a href='"+messageurl[i_messages]+"' target='_blank'>"+message[i_messages]+"</a></span></td></tr></table>")document.imgcontainer1.document.close()i_messages++if (i_messages>message.length-1) {i_messages=0}   var timer=setTimeout("rotatenetscape()",pause)}// - 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 onload=checkbrowser()><SCRIPT><!-- Beginning of JavaScript -if (document.all) {for (i=0;i<=y_slices-1;i++) {for (ii=0;ii<=x_slices-1;ii++) {    document.write("<div id='span"+spancounter+"' class='messagebox'>")    document.write("</div>")spancounter++}}}if (document.layers) {document.write("<div id='imgcontainer1' class='messagebox'>")document.write("</div>")document.close()document.imgcontainer1.left=x_finalposdocument.imgcontainer1.top=y_finalpos}// - End of JavaScript - --></SCRIPT></BODY><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->