Advertisement
honghoavi

Merry Christmas - Ringing Bells - 01

Dec 8th, 2012
4,590
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 6.23 KB | None | 0 0
  1. <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
  2. <script src="http://blogthietke.googlecode.com/files/btk_holiday_bells.js"></script>
  3. <script src="http://blogthietke.googlecode.com/files/btk_swfobject.min.js"></script>
  4. <style type='text/css'>
  5. /* HOLIDAY BELLS */
  6. .b-page__content { min-height:60px; }
  7. .b-head-decor { display:none; }
  8. .b-page_newyear .b-head-decor { position:absolute; top:0; left:0; display:block; height:115px; width:100%; overflow:hidden; background:url('https://lh4.googleusercontent.com/-Fw52YRWmOes/UMB0XOjXsnI/AAAAAAAAC1E/EENsIn76nXk/b-head-decor_newyear.png') repeat-x 0 0; }
  9. .b-page_newyear .b-head-decor__inner { position:absolute; top:0; left:0; height:115px; display:block; width:373px; }
  10. .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%; }
  11. .b-page_newyear .b-head-decor__inner_n2 { left:373px; }
  12. .b-page_newyear .b-head-decor__inner_n3 { left:746px; }
  13. .b-page_newyear .b-head-decor__inner_n4 { left:1119px; }
  14. .b-page_newyear .b-head-decor__inner_n5 { left:1492px; }
  15. .b-page_newyear .b-head-decor__inner_n6 { left:1865px; }
  16. .b-page_newyear .b-head-decor__inner_n7 { left:2238px; }
  17. .b-ball { position:absolute; }
  18. .b-ball_n1 { top:0; left:3px; width:59px; height:83px; }
  19. .b-ball_n2 { top:-19px; left:51px; width:55px; height:70px; }
  20. .b-ball_n3 { top:9px; left:88px; width:49px; height:67px; }
  21. .b-ball_n4 { top:0; left:133px; width:57px; height:102px; }
  22. .b-ball_n5 { top:0; left:166px; width:49px; height:57px; }
  23. .b-ball_n6 { top:6px; left:200px; width:54px; height:70px; }
  24. .b-ball_n7 { top:0; left:240px; width:56px; height:67px; }
  25. .b-ball_n8 { top:0; left:283px; width:54px; height:53px; }
  26. .b-ball_n9 { top:10px; left:321px; width:49px; height:66px; }
  27. .b-ball_n1 .b-ball__i { background:url('https://lh3.googleusercontent.com/-CBEwMmGrqZ8/UMB0VT8RJMI/AAAAAAAAC0U/VVuQKjz292Y/b-ball_n1.png') no-repeat; }
  28. .b-ball_n2 .b-ball__i { background:url('https://lh5.googleusercontent.com/-wOz2yKeFu7I/UMB0URa7HNI/AAAAAAAAC0I/XnAVs3w9_Vw/b-ball_n2.png') no-repeat; }
  29. .b-ball_n3 .b-ball__i { background:url('https://lh5.googleusercontent.com/-8A4ZJeTF4cg/UMB0UygpdrI/AAAAAAAAC0M/NfoWup7hI58/s67/b-ball_n3.png') no-repeat; }
  30. .b-ball_n4 .b-ball__i { background:url('https://lh3.googleusercontent.com/-Nx7_Tm-nkAI/UMB0VkMAHpI/AAAAAAAAC0c/09GjFBtv1Sw/b-ball_n4.png') no-repeat; }
  31. .b-ball_n5 .b-ball__i { background:url('https://lh5.googleusercontent.com/-4P-GX2WVLXI/UMB0V6O1MrI/AAAAAAAAC0Y/nNZOwiGOmRc/b-ball_n5.png') no-repeat; }
  32. .b-ball_n6 .b-ball__i { background:url('https://lh4.googleusercontent.com/-Y8mmZd60f5k/UMB0WEfbWcI/AAAAAAAAC0k/xf-TW8EU0-w/b-ball_n6.png') no-repeat; }
  33. .b-ball_n7 .b-ball__i { background:url('https://lh3.googleusercontent.com/-BYfmH5Mpksw/UMB0WbPto9I/AAAAAAAAC00/jFbTK8qzXbs/b-ball_n7.png') no-repeat; }
  34. .b-ball_n8 .b-ball__i { background:url('https://lh5.googleusercontent.com/-AkG1qZqE2lA/UMB0WnEGXtI/AAAAAAAAC0s/VgQQkCeP7YQ/b-ball_n8.png') no-repeat; }
  35. .b-ball_n9 .b-ball__i { background:url('https://lh5.googleusercontent.com/-qyza4SONUdM/UMB0W64FoOI/AAAAAAAAC1A/uBhV0yD6sbk/b-ball_n9.png') no-repeat; }
  36. .b-ball_i1 .b-ball__i { background:url('https://lh6.googleusercontent.com/-QhhDd1SE_V0/UMB0PA61nFI/AAAAAAAACzg/CXvrLe3CRjI/b-ball_i1.png') no-repeat; }
  37. .b-ball_i2 .b-ball__i { background:url('https://lh4.googleusercontent.com/-9XMuFc_Yp5c/UMB0QBkDNuI/AAAAAAAACzk/bKiU8K3vgXU/s61/b-ball_i2.png') no-repeat; }
  38. .b-ball_i3 .b-ball__i { background:url('https://lh3.googleusercontent.com/-j6E5yxK2u-Y/UMB0PGXq-2I/AAAAAAAACzc/j1vsaU11xvc/b-ball_i3.png') no-repeat; }
  39. .b-ball_i4 .b-ball__i { background:url('https://lh6.googleusercontent.com/-o2OZuJyWj4s/UMB0QoPX2KI/AAAAAAAACz4/JQIHqmVrhS8/b-ball_i4.png') no-repeat; }
  40. .b-ball_i5 .b-ball__i { background:url('https://lh5.googleusercontent.com/-kG7U9F_tEx4/UMB0QYsHNLI/AAAAAAAACzw/3QInJrJIIfA/b-ball_i5.png') no-repeat; }
  41. .b-ball_i6 .b-ball__i { background:url('https://lh4.googleusercontent.com/-TWr-kxeQTSc/UMB0UdruXgI/AAAAAAAAC0E/CS9sAXVQ_9E/b-ball_i6.png') no-repeat; }
  42. .b-ball_i1{top:0; left:0; width:25px; height:71px; }
  43. .b-ball_i2{top:0; left:25px; width:61px; height:27px; }
  44. .b-ball_i3{top:0; left:176px; width:29px; height:31px; }
  45. .b-ball_i4{top:0; left:205px; width:50px; height:51px; }
  46. .b-ball_i5{top:0; left:289px; width:78px; height:28px; }
  47. .b-ball_i6{top:0; left:367px; width:6px; height:69px; }
  48. .b-ball__i { position:absolute; width:100%; height:100%; -webkit-transform-origin:50% 0; -moz-transform-origin:50% 0; -o-transform-origin:50% 0; transform-origin:50% 0; -webkit-transition:all .3s ease-in-out; -moz-transition:all .3s ease-in-out; -o-transition:all .3s ease-in-out; transition:all .3s ease-in-out; pointer-events:none; }
  49. .b-ball_bounce .b-ball__right{position:absolute; top:0; right:0; left:50%; bottom:0; z-index:9; }
  50. .b-ball_bounce:hover .b-ball__right{ display:none; }
  51. .b-ball_bounce .b-ball__right:hover{ left:0; display:block!important; }
  52. .b-ball_bounce.bounce>.b-ball__i{ -webkit-transform:rotate(-9deg); -moz-transform:rotate(-9deg); -o-transform:rotate(-9deg); transform:rotate(-9deg); }
  53. .b-ball_bounce .b-ball__right.bounce+.b-ball__i { -webkit-transform:rotate(9deg); -moz-transform:rotate(9deg); -o-transform:rotate(9deg); transform:rotate(9deg); }
  54. .b-ball_bounce.bounce1>.b-ball__i {-webkit-transform:rotate(6deg); -moz-transform:rotate(6deg); -o-transform:rotate(6deg); transform:rotate(6deg); }
  55. .b-ball_bounce .b-ball__right.bounce1+.b-ball__i {-webkit-transform:rotate(-6deg); -moz-transform:rotate(-6deg); -o-transform:rotate(-6deg); transform:rotate(-6deg); }
  56. .b-ball_bounce.bounce2>.b-ball__i{ -webkit-transform:rotate(-3deg); -moz-transform:rotate(-3deg); -o-transform:rotate(-3deg); transform:rotate(-3deg); }
  57. .b-ball_bounce .b-ball__right.bounce2+.b-ball__i{ -webkit-transform:rotate(3deg); -moz-transform:rotate(3deg); -o-transform:rotate(3deg); transform:rotate(3deg); }
  58. .b-ball_bounce.bounce3>.b-ball__i {-webkit-transform:rotate(1.5deg); -moz-transform:rotate(1.5deg); -o-transform:rotate(1.5deg); transform:rotate(1.5deg); }
  59. .b-ball_bounce .b-ball__right.bounce3+.b-ball__i { -webkit-transform:rotate(-1.5deg); -moz-transform:rotate(-1.5deg); -o-transform:rotate(-1.5deg); transform:rotate(-1.5deg); }
  60. </style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement