Advertisement
EmilyTozerr

Groovy 1970's Effect.

Jun 10th, 2012
48
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.34 KB | None | 0 0
  1. <script type="text/javascript">
  2. // <![CDATA[
  3. var border=50; // how wide is each border
  4. var effects=3; // how many of the effect are on the page
  5. var speed=50; // how fast is the animation (lower is faster)
  6. var colours=new Array("#9cf", "#c9f", "#fc9", "#f9c", "#cf9", "#9fc", "#6ff", "#f6f", "#ff6");
  7. // above line lists colours for the groovy effect (can be as long or short as you like)
  8.  
  9. /****************************
  10. *1970s Groovy WebPage Effect*
  11. *(c)2008-11 mf2fm web-design*
  12. * http://www.mf2fm.com/rv *
  13. * DON'T EDIT BELOW THIS BOX *
  14. ****************************/
  15. var swide, shigh, boddie;
  16. var h=new Array();
  17. var v=new Array();
  18. var op=1/(effects+1);
  19. window.onload=function() { if (document.getElementById) {
  20. var i, d, s;
  21. boddie=document.createElement("div");
  22. s=boddie.style;
  23. s.position="fixed";
  24. s.backgroundColor="transparent";
  25. s.top="0px";
  26. s.left="0px";
  27. s.width="100%";
  28. s.zIndex="-1";
  29. i=document.body.style.backgroundColor;
  30. if (document.body.parentNode) {
  31. if (i) document.body.parentNode.style.backgroundColor=i;
  32. document.body.style.backgroundColor="transparent";
  33. }
  34. document.body.insertBefore(boddie, document.body.firstChild);
  35. set_width();
  36. for (i=0; i<effects*10; i+=10) {
  37. d=document.createElement("div");
  38. s=d.style;
  39. s.width="100%";
  40. h[i]=Math.floor(Math.random()*shigh/2.5);
  41. h[i+1]=Math.floor(Math.random()*shigh/2.5);
  42. h[i+2]=(Math.random()<0.5?-1:1)*(2+Math.floor(Math.random()*3));
  43. h[i+3]=(Math.random()<0.5?-1:1)*(2+Math.floor(Math.random()*3));
  44. s.top=h[i]+"px";
  45. s.bottom=h[i+1]+"px";
  46. s.position="absolute";
  47. s.borderColor=jazz();
  48. s.borderStyle="solid";
  49. s.borderWidth=border+"px 0px";
  50. s.backgroundColor=jazz();
  51. if (navigator.appName=="Microsoft Internet Explorer") s.filter="alpha(opacity="+(100*op)+")";
  52. else s.opacity=op;
  53. h[i+5]=s;
  54. boddie.appendChild(d);
  55. }
  56. for (i=0; i<effects*10; i+=10) {
  57. d=document.createElement("div");
  58. s=d.style;
  59. s.height="100%";
  60. v[i]=Math.floor(Math.random()*swide/2.5);
  61. v[i+1]=Math.floor(Math.random()*swide/2.5);
  62. v[i+2]=(Math.random()<0.5?-1:1)*(2+Math.floor(Math.random()*3));
  63. v[i+3]=(Math.random()<0.5?-1:1)*(2+Math.floor(Math.random()*3));
  64. s.left=v[i]+"px";
  65. s.right=v[i+1]+"px";
  66. s.position="absolute";
  67. s.borderColor=jazz();
  68. s.borderStyle="solid";
  69. s.borderWidth="0px "+border+"px";
  70. s.backgroundColor=jazz();
  71. if (navigator.appName=="Microsoft Internet Explorer") s.filter="alpha(opacity="+(100*op)+")";
  72. else s.opacity=op;
  73. v[i+5]=s;
  74. boddie.appendChild(d);
  75. }
  76. setInterval('groovy()', speed);
  77. }}
  78.  
  79. var old_jazz=false;
  80. function jazz() {
  81. var new_jazz;
  82. do { new_jazz=colours[Math.floor(Math.random()*colours.length)]; }
  83. while ( new_jazz==old_jazz );
  84. old_jazz=new_jazz;
  85. return (new_jazz);
  86. }
  87.  
  88. function scat(no) {
  89. var yes;
  90. no=no*Math.abs(no);
  91. do { yes=2+Math.floor(Math.random()*3); }
  92. while ( no==yes );
  93. return (yes);
  94. }
  95.  
  96. function groovy() {
  97. var i;
  98. for (i=0; i<effects*10; i+=10) {
  99. h[i]+=h[i+2];
  100. h[i+1]+=h[i+3];
  101. if (h[i]+h[i+1]>shigh-border*2) {
  102. h[i+4]=h[i+2];
  103. h[i+2]=-h[i+3];
  104. h[i+3]=-h[i+4];
  105. h[i+5].backgroundColor=jazz();
  106. }
  107. if (h[i]<-border && Math.random()<1/border) {
  108. h[i+2]=scat(h[i+3]);
  109. if (h[i+1]>shigh) h[i+5].borderColor=jazz();
  110. }
  111. else if (h[i]>shigh && Math.random()<1/border) {
  112. h[i+2]=-scat(h[i+3]);
  113. }
  114. if (h[i+1]<-border && Math.random()<1/border) {
  115. h[i+3]=scat(h[i+2]);
  116. if (h[i]>shigh) h[i+5].borderColor=jazz();
  117. }
  118. else if (h[i+1]>shigh && Math.random()<1/border) {
  119. h[i+3]=-scat(h[i+2]);
  120. }
  121. h[i+5].top=h[i]+"px";
  122. h[i+5].bottom=h[i+1]+"px";
  123. }
  124. for (i=0; i<effects*10; i+=10) {
  125. v[i]+=v[i+2];
  126. v[i+1]+=v[i+3];
  127. if (v[i]+v[i+1]>swide-border*2) {
  128. v[i+4]=v[i+2];
  129. v[i+2]=-v[i+3];
  130. v[i+3]=-v[i+4];
  131. v[i+5].backgroundColor=jazz();
  132. }
  133. if (v[i]<-border && Math.random()<1/border) {
  134. v[i+2]=scat(v[i+3]);
  135. if (v[i+1]>swide) v[i+5].borderColor=jazz();
  136. }
  137. else if (v[i]>swide && Math.random()<1/border) {
  138. v[i+2]=-scat(v[i+3]);
  139. }
  140. if (v[i+1]<-border && Math.random()<1/border) {
  141. v[i+3]=scat(v[i+2]);
  142. if (v[i]>swide) v[i+5].borderColor=jazz();
  143. }
  144. else if (v[i+1]>swide && Math.random()<1/border) {
  145. v[i+3]=-scat(v[i+2]);
  146. }
  147. v[i+5].left=v[i]+"px";
  148. v[i+5].right=v[i+1]+"px";
  149. }
  150. }
  151.  
  152. window.onresize=set_width;
  153. function set_width() {
  154. var sw_min=999999;
  155. var sh_min=999999;
  156. if (document.documentElement && document.documentElement.clientWidth) {
  157. if (document.documentElement.clientWidth>0) sw_min=document.documentElement.clientWidth;
  158. if (document.documentElement.clientHeight>0) sh_min=document.documentElement.clientHeight;
  159. }
  160. if (typeof(self.innerWidth)!="undefined" && self.innerWidth) {
  161. if (self.innerWidth>0 && self.innerWidth<sw_min) sw_min=self.innerWidth;
  162. if (self.innerHeight>0 && self.innerHeight<sh_min) sh_min=self.innerHeight;
  163. }
  164. if (document.body.clientWidth) {
  165. if (document.body.clientWidth>0 && document.body.clientWidth<sw_min) sw_min=document.body.clientWidth;
  166. if (document.body.clientHeight>0 && document.body.clientHeight<sh_min) sh_min=document.body.clientHeight;
  167. }
  168. if (sw_min==999999 || sh_min==999999) {
  169. sw_min=800;
  170. sh_min=600;
  171. }
  172. swide=sw_min;
  173. shigh=sh_min;
  174. boddie.style.height=shigh+"px";
  175. }
  176. // ]]>
  177. </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement