Added snowflake character and transparency options. Renamed "small" a…

…nd "large" option to avoid confusion.
joshmcrty · Dec 4, 2013 · 60abbdf · 60abbdf
1 parent 2292799
commit 60abbdf
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 15 deletions.
diff --git a/index.html b/index.html
@@ -0,0 +1,27 @@
+<html>
+    <head>
+        <style>
+            body{
+                background: darkblue;
+            }
+        </style>
+        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
+        <script src="jquery.flurry.js"></script>
+    </head>
+    <body>
+        <script>
+            $( document ).ready( function() {
+                $().flurry({
+                    height: 1000,
+                    speed: 3000,
+                    wind: 400,
+                    variance: 100,
+                    largest: 75,
+                    smallest: 25,
+                    density: 1,
+                    transparency: 0.4
+                });
+            });
+        </script>
+    </body>
+</html>
diff --git a/jquery.flurry.js b/jquery.flurry.js
@@ -8,20 +8,22 @@
  * @copyright 2013 Josh McCarty
  * @license   https://github.com/joshmcrty/Flurry/blob/master/LICENSE GPLv2
  */
-( function( $ ) {
+;( function( $, window ) {
 
   $.fn.flurry = function( options ) {
 
     // Settings
     var settings = $.extend({
-      height: 150,
-      density: 100,
-      speed: 3000,
-      small: 12,
-      large: 20,
-      wind: 40,
-      variance: 20,
-      preventScroll: true
+        height: 150,
+        density: 100,
+        speed: 3000,
+        smallest: 12,
+        largest: 20,
+        wind: 40,
+        variance: 20,
+        preventScroll: true,
+        character: "&bull;", //&#10052; could also be used
+        transparency: 1 //The alpha in the rgba of the character's color
     }, options );
 
     // Prevent browser horizontal scrolling
@@ -41,20 +43,20 @@
     var randomNumberInRange = function( min, max ) {
       return Math.random() * ( max - min ) + min;
     };
-    
+
     // Create and animate a flake
     var createFlake = function() {
 
       // Set the flake's starting position to a random number between the window width, including additional space for the wind setting
       var left = randomNumberInRange( 0 - Math.abs( settings.wind ), windowWidth + Math.abs( settings.wind ) );
 
       // Create the flake, set the CSS for it, and animate it
-      var flake = '<span>&bull;</span>';
+      var flake = '<span>' + settings.character + '</span>';
       $( flake ).css({
-        "color": "#FFF",
-        "font-size": randomNumberInRange( settings.small, settings.large ) + "px",
+        "color": "rgba(255, 255, 255, " + settings.transparency + ")",
+        "font-size": randomNumberInRange( settings.smallest, settings.largest ) + "px",
         "position": "absolute",
-        "top": "-" + settings.large + "px",
+        "top": "-" + settings.largest + "px",
         "left": left + "px",
         "z-index": "999"
       }).appendTo( 'body' ).animate({
@@ -64,9 +66,10 @@
       }, randomNumberInRange( settings.speed - 400, settings.speed + 400 ), "linear", function() {
         $( this ).remove();
       });
+
     };
 
     // Generate flakes at the interval set by the density setting
     setInterval( createFlake, settings.density );
   };
-}( jQuery ));
+}( jQuery, window, undefined ));