home *** CD-ROM | disk | FTP | other *** search
/ PC User 2005 May / CD / PCU0505CD.iso / software / full / coffecup / files / html2005.exe / %MAINDIR% / Javascript / Snow.xml < prev    next >
Encoding:
Text File  |  2005-02-16  |  4.1 KB  |  134 lines
  1. <ccResource>
  2.   <ccTitle>
  3. Snow
  4.   </ccTitle>
  5.   <ccCategory>
  6. Browser
  7.   </ccCategory>
  8.   <ccDescription>
  9. Put some JavaScript-powered snow on your web site! Dozens of snowflakes carelessly drift back and forth as they float down the browser window. Only works in Internet Explorer 
  10. <ccInstructions>
  11.   1.  Copy the coding into the BODY of your HTML document
  12.   2.  Save the snow.gif image to your web site directory
  13.          </ccInstructions>
  14.   <ccHeadContent>
  15.   
  16.   </ccHeadContent>
  17.   <ccBodyContent>
  18.  
  19. <SCRIPT LANGUAGE="JavaScript1.2">
  20.  
  21. <!-- Begin
  22. var no = 25; // snow number
  23. var speed = 10; // smaller number moves the snow faster
  24. var snowflake = "http://www.your-web-site-address-here.com/snow.gif";
  25.  
  26. var ns4up = (document.layers) ? 1 : 0;  // browser sniffer
  27. var ie4up = (document.all) ? 1 : 0;
  28. var dx, xp, yp;    // coordinate and position variables
  29. var am, stx, sty;  // amplitude and step variables
  30. var i, doc_width = 800, doc_height = 600;
  31. if (ns4up) {
  32. doc_width = self.innerWidth;
  33. doc_height = self.innerHeight;
  34. } else if (ie4up) {
  35. doc_width = document.body.clientWidth;
  36. doc_height = document.body.clientHeight;
  37. }
  38. dx = new Array();
  39. xp = new Array();
  40. yp = new Array();
  41. am = new Array();
  42. stx = new Array();
  43. sty = new Array();
  44. for (i = 0; i < no; ++ i) {  
  45. dx[i] = 0;                        // set coordinate variables
  46. xp[i] = Math.random()*(doc_width-50);  // set position variables
  47. yp[i] = Math.random()*doc_height;
  48. am[i] = Math.random()*20;         // set amplitude variables
  49. stx[i] = 0.02 + Math.random()/10; // set step variables
  50. sty[i] = 0.7 + Math.random();     // set step variables
  51. if (ns4up) {                      // set layers
  52. if (i == 0) {
  53. document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
  54. document.write("top=\"15\" visibility=\"show\"><img src=\"");
  55. document.write(snowflake + "\" border=\"0\"></layer>");
  56. } else {
  57. document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
  58. document.write("top=\"15\" visibility=\"show\"><img src=\"");
  59. document.write(snowflake + "\" border=\"0\"></layer>");
  60.    }
  61. } else if (ie4up) {
  62. if (i == 0) {
  63. document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
  64. document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
  65. document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
  66. document.write(snowflake + "\" border=\"0\"></div>");
  67. } else {
  68. document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
  69. document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
  70. document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
  71. document.write(snowflake + "\" border=\"0\"></div>");
  72.       }
  73.    }
  74. }
  75. function snowNS() {  // Netscape main animation function
  76. for (i = 0; i < no; ++ i) {  // iterate for every dot
  77. yp[i] += sty[i];
  78. if (yp[i] > doc_height-50) {
  79. xp[i] = Math.random()*(doc_width-am[i]-30);
  80. yp[i] = 0;
  81. stx[i] = 0.02 + Math.random()/10;
  82. sty[i] = 0.7 + Math.random();
  83. doc_width = self.innerWidth;
  84. doc_height = self.innerHeight;
  85. }
  86. dx[i] += stx[i];
  87. document.layers["dot"+i].top = yp[i];
  88. document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);
  89. }
  90. setTimeout("snowNS()", speed);
  91. }
  92. function snowIE() {  // IE main animation function
  93. for (i = 0; i < no; ++ i) {  // iterate for every dot
  94. yp[i] += sty[i];
  95. if (yp[i] > doc_height-50) {
  96. xp[i] = Math.random()*(doc_width-am[i]-30);
  97. yp[i] = 0;
  98. stx[i] = 0.02 + Math.random()/10;
  99. sty[i] = 0.7 + Math.random();
  100. doc_width = document.body.clientWidth;
  101. doc_height = document.body.clientHeight;
  102. }
  103. dx[i] += stx[i];
  104. document.all["dot"+i].style.pixelTop = yp[i];
  105. document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);
  106. }
  107. setTimeout("snowIE()", speed);
  108. }
  109. if (ns4up) {
  110. snowNS();
  111. } else if (ie4up) {
  112. snowIE();
  113. }
  114. // End -->
  115. </script>
  116.  
  117. <!-- STEP TWO: Save the snow.gif image to your web site directory  ->
  118.  
  119. <!-- Go to http://javascript.internet.com/img/snow/snow.gif
  120.  
  121. Right-click the image and "Save Image As..."  -->
  122.  
  123.  
  124.   </ccBodyContent>
  125.   <ccElementContent>
  126.   
  127.    <ccElementName></ccElementName>
  128.    <ccElementAction></ccElementAction>
  129.    
  130.   </ccElementContent>
  131.   <ccExtraData>
  132.  
  133.   </ccExtraData>
  134. </ccResource>