Phiên bản đầy đủ: jsB@nk » Scrollers » Theo chiều ngang » Chữ chạy qua lại trong khung
URL: https://www.javascriptbank.com/bounce-style-marquee-script.html
Hiệu ứng sẽ làm cho một đoạn văn bản do ta qui định sẽ tự động chạy qua, lại trong một khung.
Phiên bản đầy đủ: jsB@nk » Scrollers » Theo chiều ngang » Chữ chạy qua lại trong khung
URL: https://www.javascriptbank.com/bounce-style-marquee-script.html
<style type="text/css">body, td{background-color:white;font-size:12px;font-family:sans-serif;color:#00436e;}</style><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><script language="javascript">/*******************************************Bounce Scroller (Marquee Bounce Replacement) v-1.1Brian GosselinVersion notes:V-1.0: Initial release.V-1.1: Removed the need to hardcode the element's width. The script now does this for you.*******************************************///ENTER CONTENT TO SCROLL BELOW.var content='Adjust the various settings in the script to get the effect you want.<br>The "boxwidth" setting should be set wide enough for the content to bounce.';var boxheight=35; // BACKGROUND BOX HEIGHT IN PIXELS.var boxwidth=500; // BACKGROUND BOX WIDTH IN PIXELS.var boxcolor="#ffedcf"; // BACKGROUND BOX COLOR.var speed=30; // SPEED OF SCROLL IN MILLISECONDS (1 SECOND=1000 MILLISECONDS)..var pixelstep=1; // PIXELS "STEPS" PER REPITITION.//** DO NOT EDIT BEYOND THIS POINT **var outer, inner, elementwidth;var goingright=true;var w3c=(document.getElementById)?true:false;var ns4=(document.layers)?true:false;var ie4=(document.all && !w3c)?true:false;var ie5=(document.all && w3c)?true:false;var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;function getElWidth(el){if(ns4)return (el.document.width)? el.document.width : el.clip.right-el.clip.left;else if(ie4||ie5)return (el.style.width)? el.style.width:el.clientWidth;else if(w3c)return (el.style.width)?parseInt(el.style.width):parseInt(el.offsetWidth);else return -1;}var txt='';if(ns4){txt+='<table border=0 cellpadding=0 cellspacing=0 width='+boxwidth+' height='+boxheight+'><tr><td>';txt+='<ilayer name="outer" bgcolor="'+boxcolor+'" visibility="visible" width="'+boxwidth+'" height="'+boxheight+'" clip="'+boxheight+'">';txt+='<layer name="inner" visibility="hidden" left="2" top="2">';txt+=content;txt+='</layer></ilayer></td></tr></table>';}else{txt+='<div id="outer" style="position:relative; width:'+boxwidth+'; height:'+boxheight+'; visibility:visible; background-color:'+boxcolor+'; overflow:hidden; text-align:left" >';txt+='<div id="inner" style="position:absolute; visibility:hidden; left:2px; top:2px; overflow:hidden">';txt+=content;txt+='</div></div>';}document.write(txt);function init(){inner=(ns4)?document.layers['outer'].document.layers['inner']:(ie4)?document.all['inner']:document.getElementById('inner');elementwidth=Math.min(boxwidth-4,getElWidth(inner));if(ns4){document.layers['outer'].clip.height=boxheight;document.layers['outer'].clip.width=boxwidth;inner.clip.width=elementwidth;inner.clip.height=boxheight-4;inner.visibility="show";}else{inner.style.clip='rect(0px, '+elementwidth+'px, '+(boxheight-4)+'px, 0px)';inner.style.visibility="visible";}goingright=true;setInterval('bouncescroll()',speed);}function bouncescroll(){if(ns4){if(inner.left>=(boxwidth-elementwidth))goingright=false;if(inner.left<=2)goingright=true;inner.left=(goingright)?inner.left+pixelstep :inner.left-pixelstep;}else{if(parseInt(inner.style.left)>=(boxwidth-elementwidth))goingright=false;if(parseInt(inner.style.left)<=2)goingright=true;inner.style.left=((goingright)? parseInt(inner.style.left)+pixelstep: parseInt(inner.style.left)-pixelstep)+'px';}}window.onload=init;</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->