Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
</head>
<body>
</body>
</html>
 
$(function() {
  $.fn.snow({ duration: 5 * 60 * 1000 }); // 5 min
});
/** 
 * jquery.snow 1.1
 */
(function($) {
  $.fn.snow = function(options) {  
    var $flake = $("<div/>", { 
        "class": "flake",
        css: {"position": "absolute", "top": "-50px"},
        html: "&#10052;"
      }),
      documentHeight = $(document).height(),
      documentWidth = $(document).width(),
      defaults = {
        minSize: 10,
        maxSize: 20,
        newOn: 500,
        flakeColor: "#FFFFFF",
        duration: null
      },
      options = $.extend({}, defaults, options),
      passed = 0,
      interval;       
      
    interval = setInterval(function() {
      var startPositionLeft = Math.random() * documentWidth - 100,
        startOpacity = 0.5 + Math.random(),
        sizeFlake = options.minSize + Math.random() * options.maxSize,
        endPositionTop = documentHeight - 40,
        endPositionLeft = startPositionLeft - 100 + Math.random() * 200,
        durationFall = documentHeight * 10 + Math.random() * 5000;
      $flake
        .clone()
        .appendTo("body")
        .css({
          left: startPositionLeft,
          opacity: startOpacity,
          fontSize: sizeFlake,
          color: options.flakeColor
        })
        .animate({
          top: endPositionTop,
          left: endPositionLeft,
          opacity: 0.2
        }, durationFall, "linear", function() {
          $(this).remove();
        });
        if (options.duration !== null) {
          passed += options.newOn;
          if (passed >= options.duration) clearInterval(interval);
        }
      }, options.newOn);  
  };  
})(jQuery);
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers