Advertisement
talas

rolling text effect

May 3rd, 2021
1,377
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.35 KB | None | 0 0
  1. <script type="text/javascript">
  2. // <![CDATA[
  3. var text=Array("TALA", "TALA", "TALA"); // replace this with an array of your own text
  4. var delay=4; // seconds between each new text item
  5. var speed=80; // speed of the scroll
  6.  
  7. /***************************\
  8. * Rolling Text Effect *
  9. * (c)2014+ mf2fm web-design *
  10. * http://www.mf2fm.com/rv *
  11. * DON'T EDIT BELOW THIS BOX *
  12. \***************************/
  13. var diddly=new Array();
  14. var rolltop;
  15. var referee=0;
  16. delay*=1000;
  17.  
  18. if (typeof('addRVLoadEvent')!='function') function addRVLoadEvent(funky) {
  19. var oldonload=window.onload;
  20. if (typeof(oldonload)!='function') window.onload=funky;
  21. else window.onload=function() {
  22. if (oldonload) oldonload();
  23. funky();
  24. }
  25. }
  26.  
  27. addRVLoadEvent(prepare_to_go);
  28.  
  29. function prepare_to_go() {
  30. var i, r;
  31. var r=document.getElementById("rolling");
  32. rolltop=r.clientHeight;
  33. while (r.childNodes.length) r.removeChild(r.childNodes[0]);
  34. r.style.position="relative";
  35. r.style.overflow="hidden";
  36. r.appendChild(document.createTextNode(String.fromCharCode(160)));
  37. for (i=0; i<text.length; i++) {
  38. diddly[i]=document.createElement("div");
  39. diddly[i].style.position="absolute";
  40. diddly[i].style.top=rolltop+"px";
  41. diddly[i].style.left="0px";
  42. if (text[i].indexOf("www")!=-1) slinkit(diddly[i], text[i]);
  43. else diddly[i].appendChild(document.createTextNode(text[i]));
  44. r.appendChild(diddly[i]);
  45. }
  46. rolling_in_the_hay();
  47. }
  48.  
  49. function rolling_in_the_hay() {
  50. var i, j;
  51. j=referee%text.length;
  52. for (i=rolltop; i>=0; i--) setTimeout("diddly["+j+"].style.top='"+i+"px'", speed*(rolltop-i));
  53. for (i=-1; i>-rolltop; i--) setTimeout("diddly["+j+"].style.top='"+i+"px'", delay-speed*i);
  54. ++referee;
  55. setTimeout('rolling_in_the_hay()', delay);
  56. }
  57.  
  58. function slinkit(r, t) {
  59. var a, s, e;
  60. s=t.indexOf("www");
  61. e=t.indexOf(" ", s);
  62. if (e==-1) e=t.length;
  63. r.appendChild(document.createTextNode(t.substring(0, s)));
  64. a=document.createElement("a");
  65. a.href="http://"+t.substring(s, e);
  66. a.appendChild(document.createTextNode(t.substring(s, e)));
  67. r.appendChild(a);
  68. r.appendChild(document.createTextNode(t.substring(e)));
  69. }
  70. // ]]>
  71. </script>
  72. <style>
  73. h2{
  74. font-size: 200%;
  75. color: #FF99CA ;
  76. font-family: “sans-serif”;
  77. font-weight: bold;
  78. text-shadow: 3px 3px 4px #FFB0D6 ;
  79. }
  80. </style>
  81. <h2><div id="rolling">TALA</div>
  82.  
  83. </head>
  84.  
  85.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement