четверг, 11 декабря 2014 г.

КОДЫ НОВОГОДНИХ ГАДЖЕТОВ

ВСЕ КОДЫ ВСТАВЛЯТЬ    КАК     ГАДЖЕТ-HTML
(кроме кода плеера)
Выделяем левой кнопкой мыши нужный код, копируем его правой кнопкой мыши и вставляем в свой блог.

Все гаджеты использованы на этом блоге для наглядности

******************************************************************************
ШАРИКИ В ШАПКУ БЛОГА .Используйте для украшения вирусных открыток, т.к. на блоге данный гаджет может конфликтовать с гаджетом "Постоянные читатели"
<div class="b-page_newyear">
<div class="b-page__content">
<!-- новогодняя мотня newyear.html -->
<i class="b-head-decor">
<i class="b-head-decor__inner b-head-decor__inner_n1">
<div class="b-ball b-ball_n1 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n2 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n3 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n4 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n5 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n6 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n7 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n8 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n9 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i1"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i2"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i3"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i4"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i5"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i6"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
</i>
<i class="b-head-decor__inner b-head-decor__inner_n2">
<div class="b-ball b-ball_n1 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n2 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n3 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n4 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n5 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n6 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n7 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n8 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n9 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i1"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i2"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i3"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i4"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i5"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i6"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
</i>
<i class="b-head-decor__inner b-head-decor__inner_n3">
<div class="b-ball b-ball_n1 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n2 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n3 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n4 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n5 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n6 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n7 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n8 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n9 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i1"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i2"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i3"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i4"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i5"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i6"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
</i>
<i class="b-head-decor__inner b-head-decor__inner_n4">
<div class="b-ball b-ball_n1 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n2 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n3 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n4 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n5 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n6 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n7 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n8 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n9 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i1"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i2"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i3"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i4"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i5"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i6"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
</i>
<i class="b-head-decor__inner b-head-decor__inner_n5">
<div class="b-ball b-ball_n1 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n2 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n3 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n4 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n5 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n6 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n7 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n8 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n9 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i1"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i2"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i3"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i4"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i5"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i6"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
</i>
<i class="b-head-decor__inner b-head-decor__inner_n6">
<div class="b-ball b-ball_n1 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n2 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n3 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n4 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n5 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n6 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n7 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n8 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n9 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i1"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i2"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i3"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i4"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i5"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i6"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
</i>
<i class="b-head-decor__inner b-head-decor__inner_n7">
<div class="b-ball b-ball_n1 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n2 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n3 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n4 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n5 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n6 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_n7 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>

<div class="b-ball b-ball_n8 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>

<div class="b-ball b-ball_n9 b-ball_bounce"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i1"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i2"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i3"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i4"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i5"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
<div class="b-ball b-ball_i6"><div class="b-ball__right"></div><div class="b-ball__i"></div></div>
</i>
</i>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> <script src="http://megascripts.ru/demo/new_year_motnya/swfobject.min.js" type="text/javascript"></script> <script src="http://megascripts.ru/demo/new_year_motnya/newyear.js" type="text/javascript"></script><link href="http://megascripts.ru/demo/new_year_motnya/style.css" rel="stylesheet" />
 transform-origin: 50% 14px;

******************************************************************************

ГОЛУБЫЕ СНЕЖИНКИ, ПАДАЮЩИЕ НА БЛОГЕ




<script type="text/javascript">

//Configure below to change URL path to the snow image
var snowsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzaxxiNETWXDaAJapYw23vT-Qr7FTEK1emFzSoe95wVHOrZRgqcIOOYlI0rVla98gPcHQ6f6x632Apnj3CTPxFsC6vSQAfsBHT9ljGH-BAJpVdbXErhXmxLHxu2Gl7QysEJa9IONlHXjK4/s1600/3b25ca_02d78629aa0e4b65a62499cff681ab69.gif"


// Configure below to change number of snow to render
var no = 12;
// Configure whether snow should disappear after x seconds (0=never):
var hidesnowtime = 0;
// Configure how much snow should drop down before fading ("windowheight" or "pageheight")
var snowdistance = "pageheight";
///////////Stop Config//////////////////////////////////
var ie4up = (document.all) ? 1 : 0;
var ns6up = (document.getElementById&&!document.all) ? 1 : 0;
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
var dx, xp, yp; // coordinate and position variables
var am, stx, sty; // amplitude and step variables
var i, doc_width = 800, doc_height = 600;

if (ns6up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight;
} else if (ie4up) {
doc_width = iecompattest().clientWidth;
doc_height = iecompattest().clientHeight;
}
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();


snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzaxxiNETWXDaAJapYw23vT-Qr7FTEK1emFzSoe95wVHOrZRgqcIOOYlI0rVla98gPcHQ6f6x632Apnj3CTPxFsC6vSQAfsBHT9ljGH-BAJpVdbXErhXmxLHxu2Gl7QysEJa9IONlHXjK4/s1600/3b25ca_02d78629aa0e4b65a62499cff681ab69.gif" : snowsrc


for (i = 0; i < no; ++ i) {
dx[i] = 0; // set coordinate variables
xp[i] = Math.random()*(doc_width-50); // set position variables
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20; // set amplitude variables
stx[i] = 0.02 + Math.random()/10; // set step variables
sty[i] = 0.7 + Math.random(); // set step variables
if (ie4up||ns6up) {
if (i == 0) {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>");
} else {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>");
}
}
}
function snowIE_NS6() { // IE and NS6 main animation function
doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
for (i = 0; i < no; ++ i) { // iterate for every dot
yp[i] += sty[i];
if (yp[i] > doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
}
dx[i] += stx[i];
document.getElementById("dot"+i).style.top=yp[i]+"px";
document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";
}
snowtimer=setTimeout("snowIE_NS6()", 10);
}
function hidesnow(){
if (window.snowtimer) clearTimeout(snowtimer)
for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
}
if (ie4up||ns6up){
snowIE_NS6();
if (hidesnowtime>0)
setTimeout("hidesnow()", hidesnowtime*1000)
}
</script>

**************************************************************************

 ШАРИКИ С КОЛОКОЛЬЧИКАМИ ПО КРАЯМ В ШАПКУ БЛОГА
этот гаджет взят с сайта blogodel.com (здесь можно найти много интересного)
Не ставьте к себе на блог этот гаджет (только в открытки), т.к. код конфликтует с гаджетом "Постоянные читатели".Используйте для украшения вирусных открыток.

********************************************************************

<style type="text/css">
 .st2 {

 border:3px solid #BBBBBB;opacity: 2.1;
 -webkit-animation: ring 18s 19s ease-in-out infinite;
 -webkit-transform-origin: 50% 14px;
 -moz-animation: ring 18s 19s ease-in-out infinite;
 -moz-transform-origin: 50% 14px;
 animation: ring 18s 19s ease-in-out infinite;
}

@-webkit-keyframes ring {
 0% { -webkit-transform: rotateZ(0); }
 1%, 9% { -webkit-transform: rotateZ(30deg); }
 3% { -webkit-transform: rotateZ(-28deg); }
 5% { -webkit-transform: rotateZ(34deg); }
 7% { -webkit-transform: rotateZ(-32deg); }
 11% { -webkit-transform: rotateZ(-28deg); }
 13% { -webkit-transform: rotateZ(26deg); }
 15% { -webkit-transform: rotateZ(-24deg); }
 17% { -webkit-transform: rotateZ(22deg); }
 19% { -webkit-transform: rotateZ(-20deg); }
 21% { -webkit-transform: rotateZ(18deg); }
 23% { -webkit-transform: rotateZ(-16deg); }
 25% { -webkit-transform: rotateZ(14deg); }
 27% { -webkit-transform: rotateZ(-12deg); }
 29% { -webkit-transform: rotateZ(10deg); }
 31% { -webkit-transform: rotateZ(-8deg); }
 33% { -webkit-transform: rotateZ(6deg); }
 35% { -webkit-transform: rotateZ(-4deg); }
 37% { -webkit-transform: rotateZ(2deg); }
 39% { -webkit-transform: rotateZ(-1deg); }
 41% { -webkit-transform: rotateZ(1deg); }
 43% { -webkit-transform: rotateZ(0); }
 100% { -webkit-transform: rotateZ(0); }
}

@-moz-keyframes ring {
 0% { -moz-transform: rotate(0); }
 1%, 9% { -moz-transform: rotate(30deg); }
 3% { -moz-transform: rotate(-28deg); }
 5% { -moz-transform: rotate(34deg); }
 7% { -moz-transform: rotate(-32deg); }
 11% { -moz-transform: rotate(-28deg); }
 13% { -moz-transform: rotate(26deg); }
 15% { -moz-transform: rotate(-24deg); }
 17% { -moz-transform: rotate(22deg); }
 19% { -moz-transform: rotate(-20deg); }
 21% { -moz-transform: rotate(18deg); }
 23% { -moz-transform: rotate(-16deg); }
 25% { -moz-transform: rotate(14deg); }
 27% { -moz-transform: rotate(-12deg); }
 29% { -moz-transform: rotate(10deg); }
 31% { -moz-transform: rotate(-8deg); }
 33% { -moz-transform: rotate(6deg); }
 35% { -moz-transform: rotate(-4deg); }
 37% { -moz-transform: rotate(2deg); }
 39% { -moz-transform: rotate(-1deg); }
 41% { -moz-transform: rotate(1deg); }
 43% { -moz-transform: rotate(0); }
 100% { -moz-transform: rotate(0); }
}

@keyframes ring {
 0% { transform: rotate(0); }
 1%, 9% { transform: rotate(30deg); }
 3% { transform: rotate(-28deg); }
 5% { transform: rotate(34deg); }
 7% { transform: rotate(-32deg); }
 9% { transform: rotate(30deg); }
 11% { transform: rotate(-28deg); }
 13% { transform: rotate(26deg); }
 15% { transform: rotate(-24deg); }
 17% { transform: rotate(22deg); }
 19% { transform: rotate(-20deg); }
 21% { transform: rotate(18deg); }
 23% { transform: rotate(-16deg); }
 25% { transform: rotate(14deg); }
 27% { transform: rotate(-12deg); }
 29% { transform: rotate(10deg); }
 31% { transform: rotate(-8deg); }
 33% { transform: rotate(6deg); }
 35% { transform: rotate(-4deg); }
 37% { transform: rotate(2deg); }
 39% { transform: rotate(-1deg); }
 41% { transform: rotate(1deg); }
 43% { transform: rotate(0); }
 100% { transform: rotate(0); }



</style>

<div style="padding: 0px;">
<img class="st2" src="http://mechta.by/wp-content/themes/paris/images/b-head-decor/b-ball_n2.png" style="position:fixed; top: 0px;left:130px;border:none;z-index:9;"/></div><style type="text/css">
 .st1 {

 border:3px solid #BBBBBB;opacity: 2.1;
 -webkit-animation: ring 20s 19s ease-in-out infinite;
 -webkit-transform-origin: 50% 14px;
 -moz-animation: ring 20s 19s ease-in-out infinite;
 -moz-transform-origin: 50% 14px;
 animation: ring 20s 19s ease-in-out infinite;
 transform-origin: 50% 14px;
}

@-webkit-keyframes ring {
 0% { -webkit-transform: rotateZ(0); }
 1%, 9% { -webkit-transform: rotateZ(30deg); }
 3% { -webkit-transform: rotateZ(-28deg); }
 5% { -webkit-transform: rotateZ(34deg); }
 7% { -webkit-transform: rotateZ(-32deg); }
 11% { -webkit-transform: rotateZ(-28deg); }
 13% { -webkit-transform: rotateZ(26deg); }
 15% { -webkit-transform: rotateZ(-24deg); }
 17% { -webkit-transform: rotateZ(22deg); }
 19% { -webkit-transform: rotateZ(-20deg); }
 21% { -webkit-transform: rotateZ(18deg); }
 23% { -webkit-transform: rotateZ(-16deg); }
 25% { -webkit-transform: rotateZ(14deg); }
 27% { -webkit-transform: rotateZ(-12deg); }
 29% { -webkit-transform: rotateZ(10deg); }
 31% { -webkit-transform: rotateZ(-8deg); }
 33% { -webkit-transform: rotateZ(6deg); }
 35% { -webkit-transform: rotateZ(-4deg); }
 37% { -webkit-transform: rotateZ(2deg); }
 39% { -webkit-transform: rotateZ(-1deg); }
 41% { -webkit-transform: rotateZ(1deg); }
 43% { -webkit-transform: rotateZ(0); }
 100% { -webkit-transform: rotateZ(0); }
}

@-moz-keyframes ring {
 0% { -moz-transform: rotate(0); }
 1%, 9% { -moz-transform: rotate(30deg); }
 3% { -moz-transform: rotate(-28deg); }
 5% { -moz-transform: rotate(34deg); }
 7% { -moz-transform: rotate(-32deg); }
 11% { -moz-transform: rotate(-28deg); }
 13% { -moz-transform: rotate(26deg); }
 15% { -moz-transform: rotate(-24deg); }
 17% { -moz-transform: rotate(22deg); }
 19% { -moz-transform: rotate(-20deg); }
 21% { -moz-transform: rotate(18deg); }
 23% { -moz-transform: rotate(-16deg); }
 25% { -moz-transform: rotate(14deg); }
 27% { -moz-transform: rotate(-12deg); }
 29% { -moz-transform: rotate(10deg); }
 31% { -moz-transform: rotate(-8deg); }
 33% { -moz-transform: rotate(6deg); }
 35% { -moz-transform: rotate(-4deg); }
 37% { -moz-transform: rotate(2deg); }
 39% { -moz-transform: rotate(-1deg); }
 41% { -moz-transform: rotate(1deg); }
 43% { -moz-transform: rotate(0); }
 100% { -moz-transform: rotate(0); }
}

@keyframes ring {
 0% { transform: rotate(0); }
 1%, 9% { transform: rotate(30deg); }
 3% { transform: rotate(-28deg); }
 5% { transform: rotate(34deg); }
 7% { transform: rotate(-32deg); }
 9% { transform: rotate(30deg); }
 11% { transform: rotate(-28deg); }
 13% { transform: rotate(26deg); }
 15% { transform: rotate(-24deg); }
 17% { transform: rotate(22deg); }
 19% { transform: rotate(-20deg); }
 21% { transform: rotate(18deg); }
 23% { transform: rotate(-16deg); }
 25% { transform: rotate(14deg); }
 27% { transform: rotate(-12deg); }
 29% { transform: rotate(10deg); }
 31% { transform: rotate(-8deg); }
 33% { transform: rotate(6deg); }
 35% { transform: rotate(-4deg); }
 37% { transform: rotate(2deg); }
 39% { transform: rotate(-1deg); }
 41% { transform: rotate(1deg); }
 43% { transform: rotate(0); }
 100% { transform: rotate(0); }

</style>

<div style="padding: 0px;">
<img class="st1" src="http://mechta.by/wp-content/themes/paris/images/b-head-decor/b-ball_n4.png" style="position:fixed; top: 0px;left:250px;border:none;z-index:6;"/></div><style type="text/css">
 .st {

 border:3px solid #BBBBBB;opacity: 2.1;
 -webkit-animation: ring 19s 19s ease-in-out infinite;
 -webkit-transform-origin: 50% 14px;
 -moz-animation: ring 19s 19s ease-in-out infinite;
 -moz-transform-origin: 50% 14px;
 animation: ring 19s 19s ease-in-out infinite;
 transform-origin: 50% 14px;
}


@-webkit-keyframes ring {
 0% { -webkit-transform: rotateZ(0); }
 1%, 9% { -webkit-transform: rotateZ(30deg); }
 3% { -webkit-transform: rotateZ(-28deg); }
 5% { -webkit-transform: rotateZ(34deg); }
 7% { -webkit-transform: rotateZ(-32deg); }
 11% { -webkit-transform: rotateZ(-28deg); }
 13% { -webkit-transform: rotateZ(26deg); }
 15% { -webkit-transform: rotateZ(-24deg); }
 17% { -webkit-transform: rotateZ(22deg); }
 19% { -webkit-transform: rotateZ(-20deg); }
 21% { -webkit-transform: rotateZ(18deg); }
 23% { -webkit-transform: rotateZ(-16deg); }
 25% { -webkit-transform: rotateZ(14deg); }
 27% { -webkit-transform: rotateZ(-12deg); }
 29% { -webkit-transform: rotateZ(10deg); }
 31% { -webkit-transform: rotateZ(-8deg); }
 33% { -webkit-transform: rotateZ(6deg); }
 35% { -webkit-transform: rotateZ(-4deg); }
 37% { -webkit-transform: rotateZ(2deg); }
 39% { -webkit-transform: rotateZ(-1deg); }
 41% { -webkit-transform: rotateZ(1deg); }
 43% { -webkit-transform: rotateZ(0); }
 100% { -webkit-transform: rotateZ(0); }
}

@-moz-keyframes ring {
 0% { -moz-transform: rotate(0); }
 1%, 9% { -moz-transform: rotate(30deg); }
 3% { -moz-transform: rotate(-28deg); }
 5% { -moz-transform: rotate(34deg); }
 7% { -moz-transform: rotate(-32deg); }
 11% { -moz-transform: rotate(-28deg); }
 13% { -moz-transform: rotate(26deg); }
 15% { -moz-transform: rotate(-24deg); }
 17% { -moz-transform: rotate(22deg); }
 19% { -moz-transform: rotate(-20deg); }
 21% { -moz-transform: rotate(18deg); }
 23% { -moz-transform: rotate(-16deg); }
 25% { -moz-transform: rotate(14deg); }
 27% { -moz-transform: rotate(-12deg); }
 29% { -moz-transform: rotate(10deg); }
 31% { -moz-transform: rotate(-8deg); }
 33% { -moz-transform: rotate(6deg); }
 35% { -moz-transform: rotate(-4deg); }
 37% { -moz-transform: rotate(2deg); }
 39% { -moz-transform: rotate(-1deg); }
 41% { -moz-transform: rotate(1deg); }
 43% { -moz-transform: rotate(0); }
 100% { -moz-transform: rotate(0); }
}

@keyframes ring {
 0% { transform: rotate(0); }
 1%, 9% { transform: rotate(30deg); }
 3% { transform: rotate(-28deg); }
 5% { transform: rotate(34deg); }
 7% { transform: rotate(-32deg); }
 9% { transform: rotate(30deg); }
 11% { transform: rotate(-28deg); }
 13% { transform: rotate(26deg); }
 15% { transform: rotate(-24deg); }
 17% { transform: rotate(22deg); }
 19% { transform: rotate(-20deg); }
 21% { transform: rotate(18deg); }
 23% { transform: rotate(-16deg); }
 25% { transform: rotate(14deg); }
 27% { transform: rotate(-12deg); }
 29% { transform: rotate(10deg); }
 31% { transform: rotate(-8deg); }
 33% { transform: rotate(6deg); }
 35% { transform: rotate(-4deg); }
 37% { transform: rotate(2deg); }
 39% { transform: rotate(-1deg); }
 41% { transform: rotate(1deg); }
 43% { transform: rotate(0); }
 100% { transform: rotate(0); }


</style>

<div style="padding: 0px;">
<img class="st1" src="http://mechta.by/wp-content/themes/paris/images/b-head-decor/b-ball_n4.png" style="position:fixed; top: 0px;right:310px;border:none;z-index:5;"/></div>
<img class="st" src="http://mechta.by/wp-content/themes/paris/images/b-head-decor/b-ball_n3.png" style="position:fixed; top: 0px;right:620px;border:none;z-index:9;"/><img class="st"  src="http://mechta.by/wp-content/themes/paris/images/b-head-decor/b-ball_n2.png" style="position:fixed; top: 0px;right:470px;border:none;z-index:9;"/><img class="st2" src="http://mechta.by/wp-content/themes/paris/images/b-head-decor/b-ball_n3.png" style="position:fixed; top: 0px;right:170px;border:none;z-index:9;"/><img src="https://lh6.googleusercontent.com/-5R7C9LMfqKY/Txo_0iOthMI/AAAAAAAAELw/rzmYWYHYXBs/w189-h197-k/christmas-icon.png" style="position:fixed; top: 0px;left:0px;border:none;z-index:9;"width="140"/><img src="https://lh4.googleusercontent.com/-PbiGUGyANAs/Txo_yfoVXSE/AAAAAAAAELw/cZylwGVCEuw/s145-c/212012" style="position:fixed; top: 0px;right:0px;border:none;z-index:5;"/><img src="http://mechta.by/wp-content/themes/paris/images/b-head-decor/b-head-decor_newyear.png" style="position:fixed; top: 0px;right:0px;border:none;z-index:1;"/><img src="http://mechta.by/wp-content/themes/paris/images/b-head-decor/b-head-decor_newyear.png" style="position:fixed; top: 0px;right:810px;border:none;z-index:5;"/><img src="http://mechta.by/wp-content/themes/paris/images/b-head-decor/b-head-decor_newyear.png" style="position:fixed; top: 0px;right:210px;border:none;z-index:5;"/><img src="http://mechta.by/wp-content/themes/paris/images/b-head-decor/b-head-decor_newyear.png" style="position:fixed; top: 0px;right:510px;border:none;z-index:5;"/>

**************************************************************

ЗВЕЗДНАЯ ПЫЛЬ С КОНЧИКА КУРСОРА


<!-- Magic dust BEGIN -->
<script type='text/javascript'>
// <![CDATA[
var colour="#ffffff";
var sparkles=50;
/****************************
* Tinkerbell Magic Sparkle *
* (c) 2005 mf2fm web-design *
* http://www.mf2fm.com/rv *
* DON'T EDIT BELOW THIS BOX *
****************************/
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="2px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="2px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";
star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}
}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {
tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>

<!-- Magic dust END -->

**************************************************************

НОВОГОДНИЕ ФОНЫ ДЛЯ ОТКРЫТОК

Копируем фоны правой кнопкой мыши, сохранив как картинку

















**************************************************************************

НОВОГОДНИЙ ПЛЕЕР С ПЕСНЕЙ

вставляем код в нужном месте через HTML сообщения



<object codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" data="http://music.privet.ru/swf/mp3player.swf" height="18" type="application/x-shockwave-flash" width="250"><param name="movie" value="http://music.privet.ru/swf/mp3player.swf"><param name="flashvars" 
value="autostart=true&bufferlength=3&showeq=true&file=http%3A%2F%2Fstat18.privet.ru%2Fmp3%2F0a30f17a8313527f722735e6bf93f376&type=mp3&id=314506830&callback=http://music.privet.ru/callback.php&backcolor=0xffdb58&frontcolor=0x ffd700 &lightcolor=0x ffbf00" /><embed src="http://music.privet.ru/swf/mp3player.swf" width="470" height="75" 
flashvars="autostart=true&bufferlength=3&showeq=true&file=http%3A%2F%2Fstat18.privet.ru%2Fmp3%2F0a30f17a8313527f722735e6bf93f376&type=mp3&id=314506830&callback==http://music.privet.ru/callback.php&backcolor=0xffdb58&frontcolor=0x ffd700&lightcolor=0x ffbf00" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /></object>
**************************************************************************

  autostart=true  - это автоматический запуск плеера
А если написать autostart=false - то его придется запускать вручную. В коде запуск прописан 2 раза и соответственно, если будете менять его, то надо поменять в 2-х местах







3 комментария:

  1. Валюша! Спасибо большое за красоту такую - воспользовалась!!! С наступающим Новым годом!!!

    ОтветитьУдалить
  2. Спасибо огромное!!!!!!!!!!!!!!!!!!!!!!!! С НАСТУПАЮЩИМ НОВЫМ ГОДОМ!!!

    ОтветитьУдалить
  3. Валентина, большое спасибо! за таккое волшебство!

    ОтветитьУдалить

transform-origin: 50% 14px;