Украшение от Яндекс

HTML

<script src="text/javascript&quot; src=&quot;http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js&quot;"></script>
<script src="type=&quot;text/javascript&quot; src=&quot;swfobject.min.j"></script>
<script src="text/javascript&quot; src=&quot;newyear.js"></script>
<script src="link rel=&quot;stylesheet&quot; href=&quot;style.css&quot;"></script>
<div class="b-page_newyear">
  <div class="b-page__content">
    <!-- новогодняя мотня newyear.html -->

   

  </div>
</div>

CSS

body {
  position: relative;
  z-index: 0;
  margin: 0;
  padding: 0 0 1em 0;
}

.b-page__content {
  min-height: 200px
}

.b-head-decor {
  display: none
}

.b-page_newyear .b-head-decor {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  height: 115px;
  width: 100%;
  overflow: hidden;
  background: url(http://pve.su/example/balls/b-head-decor_newyear.png) repeat-x 0 0
}

.b-page_newyear .b-head-decor__inner {
  position: absolute;
  top: 0;
  left: 0;
  height: 115px;
  display: block;
  width: 373px
}

.b-page_newyear .b-head-decor::before {
  content: '';
  display: block;
  position: absolute;
  top: -115px;
  left: 0;
  z-index: 3;
  height: 115px;
  display: block;
  width: 100%;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.75)
}

.b-page_newyear .b-head-decor__inner_n2 {
  left: 373px
}

.b-page_newyear .b-head-decor__inner_n3 {
  left: 746px
}

.b-page_newyear .b-head-decor__inner_n4 {
  left: 1119px
}

.b-page_newyear .b-head-decor__inner_n5 {
  left: 1492px
}

.b-page_newyear .b-head-decor__inner_n6 {
  left: 1865px
}

.b-page_newyear .b-head-decor__inner_n7 {
  left: 2238px
}

.b-ball {
  position: absolute
}

.b-ball_n1 {
  top: 0;
  left: 3px;
  width: 59px;
  height: 83px
}

.b-ball_n2 {
  top: -19px;
  left: 51px;
  width: 55px;
  height: 70px
}

.b-ball_n3 {
  top: 9px;
  left: 88px;
  width: 49px;
  height: 67px
}

.b-ball_n4 {
  top: 0;
  left: 133px;
  width: 57px;
  height: 102px
}

.b-ball_n5 {
  top: 0;
  left: 166px;
  width: 49px;
  height: 57px
}

.b-ball_n6 {
  top: 6px;
  left: 200px;
  width: 54px;
  height: 70px
}

.b-ball_n7 {
  top: 0;
  left: 240px;
  width: 56px;
  height: 67px
}

.b-ball_n8 {
  top: 0;
  left: 283px;
  width: 54px;
  height: 53px
}

.b-ball_n9 {
  top: 10px;
  left: 321px;
  width: 49px;
  height: 66px
}

.b-ball_n1 .b-ball__i {
  background: url(http://pve.su/example/balls/b-ball_n1.png) no-repeat
}

.b-ball_n2 .b-ball__i {
  background: url(http://pve.su/example/balls/b-ball_n2.png)...

JavaScript

$(function() {
  var d = function() {};
  $(document).delegate(".b-ball_bounce", "mouseenter", function() {
    b(this);
    m(this)
  }).delegate(".b-ball_bounce .b-ball__right", "mouseenter", function(i) {
    i.stopPropagation();
    b(this);
    m(this)
  });

  function f() {
    var i = "ny2012.swf";
    i = i + "?nc=" + (new Date().getTime());
    swfobject.embedSWF(i, "z-audio__player", "1", "1", "9.0.0", null, {}, {
      allowScriptAccess: "always",
      hasPriority: "true"
    })
  }

  function h(i) {
    if ($.browser.msie) {
      return window[i]
    } else {
      return document[i]
    }
  }
  window.flashInited = function() {
    d = function(j) {
      try {
        h("z-audio__player").playSound(j)
      } catch (i) {}
    }
  };
  if (window.swfobject) {
    window.setTimeout(function() {
      $("body").append('<div class="g-invisible"><div id="z-audio__player"></div></div>');
      f()
    }, 100)
  }
  var l = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "-", "=", "q", "w", "e", "r", "t", "y", "u", "i", "o", "p", "[", "]", "a", "s", "d", "f", "g", "h", "j", "k", "l", ";", "'", "\\"];
  var k = ["z", "x", "c", "v", "b", "n", "m", ",", ".", "/"];
  var g = 36;
  var a = {};
  for (var e = 0, c = l.length; e < c; e++) {
    a[l[e].charCodeAt(0)] = e
  }
  for (var e = 0, c = k.length; e < c; e++) {
    a[k[e].charCodeAt(0)] = e
  }
  $(document).keypress(function(j) {
    var i = $(j.target);
    if (!i.is("input") && j.which in a) {
      d(a[j.which])
    }
  });

  function b(n) {
    if (n.className.indexOf("b-ball__right") > -1) {
      n = n.parentNode
    }
    var i = /b-ball_n(\d+)/.exec(n.className);
    var j = /b-head-decor__inner_n(\d+)/.exec(n.parentNode.className);
    if (i && j) {
      i = parseInt(i[1], 10) - 1;
      j = parseInt(j[1], 10) - 1;
      d((i + j * 9) % g)
    }
  }

  function m(j) {
    var i = $(j);
    if (j.className.indexOf(" bounce") > -1) {
      return
    }
    i.addClass("bounce");

   ...