Snowfall Effect using CSS for Blogger Blogs

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdn.jsdelivr.net/jquery.marquee/1.3.1/jquery.marquee.min.js" type="text/javascript"></script>
<style>
#headlines {
overflow:hidden;
position:relative;
line-height:25px;
background:#34495e; /* Background Color Code By Bloggeraxe */
height:45px;
padding:0 0 0 135px;
}
#headlines h3 {
color:#fff;
font-family:Oswald, sans-serif;
font-size:17px;
font-weight:400;
text-transform:uppercase;
margin-left:-115px;
margin-top:10px;
position:absolute;
}
#headlines .right_arrow {
padding:0 38px 0 110px;
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBDyWwaiuqcg0WXTwCNVpoh2C1RrtiYuP39MduBIbsWpk0HEAy1KR7JQ4aVVYpECqjqVvxl8RjbCpnFS5QgvHbY6Xk0JLKkxd26KHFkvRqsZgovWVpXVbdmbYWkdLOhyphenhyphen1SohAMU4yVGP8W/s41/arrow.png) no-repeat right center;
height:46px;
line-height:46px;
position:absolute;
left:0;
top:0;
}
#ticker_post {
position:relative;
margin:0;
margin-left:20px;
height:50px;
width:auto;
}
.marquee {
width: 980px; /* Width of the area where entries are shown Code By Bloggeraxe */
overflow: hidden;
line-height: 45px;
}
.js-marquee a {
font-family:Oswald, sans-serif;
font-size:15px; /* Size of texts Code By Bloggeraxe */
color: #FFF; /* Color of text Code By Bloggeraxe */
padding-bottom: 20px;
text-decoration: none;
}
.ticker_separator {
color:#FFF; color: #FFF; /* Color of Posts Code By Bloggeraxe */
margin:0 10px;
}
</style>
<div id='headlines'>
<h3>News</h3>
<div class='right_arrow'></div>
<script>
var blog_url = "http://bloggeraxe.blogspot.com";
var numero_post = 10; // Number Of Posts Code By Bloggeraxe
</script>
<script type="text/javascript" src="http://yourjavascript.com/946415552/ticker.js"></script></div>
<div style='clear:both;'></div>
<script>
$(window).load(function() {
$('.marquee').marquee({
direction: 'left', // Direction left or right Code By Bloggeraxe
duration: 25000, // speed Code By Bloggeraxe
pauseOnHover: true,
duplicated: true
});
});
</script>
<style type="text/css">
#translator-wrapper {
display:block;
width:90%;
max-width:300px;
border:none;
background-color:#fff;
color:#444;
overflow:hidden;
position:relative;
height:40px;
line-height:40px;
border:1px solid #e0e0e0;
}
#translator-wrapper select {
border:none;
background:transparent;
font-family:'Verdana',Arial,Sans-Serif;
font-size:12px;
width:100%;
color:#444;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
-webkit-appearance:none;
cursor:text;
padding:5px 10px;
}
#translator-wrapper a,
#translator-wrapper a:hover {
display:block;
background-color:#4791d2;
border:none;
color:#fff;
margin:0 0;
text-decoration:none;
position:absolute;
top:0;
right:0;
bottom:0;
cursor:pointer;
width:14%;
transition:all 0.3s ease;
}
#translator-wrapper a:before {
content:"";
display:block;
width:0;
height:0;
border:6px solid transparent;
border-left-color:white;
position:absolute;
top:50%;
left:45%;
margin-top:-5px;
}
#translator-wrapper a:hover {opacity:0.9;}
#translator-wrapper a:active {opacity:0.9;}
#translator-wrapper select:focus,
#translator-wrapper a:focus,
#translator-wrapper select:active,
#translator-wrapper a:active {
border:none;
outline:none;
cursor:pointer;
}
option {
background:#444;
color:#e0e0e0;
}
</style>
<div id="translator-wrapper">
<select id="translate-language">
<option value="en" selected="selected">English</option>
<option value="id">Indonesian</option>
<option value="af">Afrikaans</option>
<option value="sq">Albanian</option>
<option value="ar">Arabic</option>
<option value="hy">Armenian</option>
<option value="az">Azerbaijani</option>
<option value="eu">Basque</option>
<option value="be">Belarusian</option>
<option value="bn">Bengali</option>
<option value="bg">Bulgarian</option>
<option value="ca">Catalan</option>
<option value="zh-CN">Chinese</option>
<option value="hr">Croatian</option>
<option value="cs">Czech</option>
<option value="da">Danish</option>
<option value="nl">Dutch</option>
<option value="en">English</option>
<option value="eo">Esperanto</option>
<option value="et">Estonian</option>
<option value="tl">Filipino</option>
<option value="fi">Finnish</option>
<option value="fr">French</option>
<option value="gl">Galician</option>
<option value="ka">Georgian</option>
<option value="de">German</option>
<option value="el">Greek</option>
<option value="gu">Gujarati</option>
<option value="ht">Haitian Creole</option>
<option value="iw">Hebrew</option>
<option value="hi">Hindi</option>
<option value="hu">Hungarian</option>
<option value="is">Icelandic</option>
<option value="id">Indonesian</option>
<option value="ga">Irish</option>
<option value="it">Italian</option>
<option value="ja">Japanese</option>
<option value="kn">Kannada</option>
<option value="ko">Korean</option>
<option value="la">Latin</option>
<option value="lv">Latvian</option>
<option value="lt">Lithuanian</option>
<option value="mk">Macedonian</option>
<option value="ms">Malay</option>
<option value="mt">Maltese</option>
<option value="no">Norwegian</option>
<option value="fa">Persian</option>
<option value="pl">Polish</option>
<option value="pt">Portuguese</option>
<option value="ro">Romanian</option>
<option value="ru">Russian</option>
<option value="sr">Serbian</option>
<option value="sk">Slovak</option>
<option value="sl">Slovenian</option>
<option value="es">Spanish</option>
<option value="sw">Swahili</option>
<option value="sv">Swedish</option>
<option value="ta">Tamil</option>
<option value="te">Telugu</option>
<option value="th">Thai</option>
<option value="tr">Turkish</option>
<option value="uk">Ukrainian</option>
<option value="ur">Urdu</option>
<option value="vi">Vietnamese</option>
<option value="cy">Welsh</option>
<option value="yi">Yiddish</option>
</select><a id="translate-me" href="#" title="Translate"></a>
</div>
<script type="text/javascript">
(function() {
var mylang = "id", // Your website language
anchor = document.getElementById('translate-me');
anchor.onclick = function() {
window.open('http://translate.google.com/translate?u=' + encodeURIComponent(location.href) + '&langpair=' + mylang + '%7C' + document.getElementById('translate-language').value + '&hl=en');
return false;
};
})();
</script>
© Copyright 2014 BloggerAxe |