Yeni yıl yaklaştı. Yeni umutlar ve yeni hedeflerle 2018 yılını geride bırakıyoruz. 2019 yılına girerken blog sayfanızda kar yağdırma efektini kullanmak istemez misiniz? Ziyaretçilerinize küçük bir sürpriz yaparak onları beyazlar içinde karşılayın. Kar yağdıran eklentiyi sayfanıza eklemek için sadece bir yere kod ekleyeceksiniz. Böylece çok fazla uğraşmadan ekleyerek ertesi gün isterseniz hemen kaldırabileceksiniz.
Sayfanızda yavaşlamaya neden olabilir ama ben bir kaç gün kullanmak istiyorum diyorsanız sayfanıza kışı getirebilirsiniz. Kar yağdırma eklentisini blog sayfanıza eklemek için Tema/ HTML'yi Düzenle kısmına giderek </head> kodunu aratarak hemen bir satır üzerine aşağıdaki kodu ekleyerek kaydetmeniz yeterli. Blog sayfanızı açtığınızda irili ufaklı karları izlemeye başlayabilirsiniz.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js'/>
<script type='text/javascript'>//<![CDATA[
(function($){$.fn.snow=function(options){var $flake=$('<div id="flake" />').css({'position':'absolute','top':'-50px'}).html('❄'),documentHeight=$(document).height(),documentWidth=$(document).width(),defaults={minSize:10,maxSize:20,newOn:500,flakeColor:"#FFFFFF"},options=$.extend({},defaults,options);var 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,'font-size':sizeFlake,color:options.flakeColor}).animate({top:endPositionTop,left:endPositionLeft,opacity:0.2},durationFall,'linear',function(){$(this).remove()});},options.newOn);};})(jQuery);//]]></script><script>$(document).ready( function(){
$.fn.snow({ minSize: 10, maxSize: 50, newOn: 400, flakeColor: '#ffffff' });
});</script>
✔ Bu içeriği beğendiyseniz lütfen paylaşın ⤵
Bende 2.0.0 jquery var, buradaki 1.7.1 sürümünü eklemeden kullanabilir miyim acaba?
YanıtlaSilEvet, oldu kullanabildim. Rengi de değiştirdim, harika oldu :D Teşekkürler :)
Sil:) Güzel olmuş, rica ederim.
SilÇok güzel olmuş deneyeceğim.
YanıtlaSilTeşekkürler
SilTeşekkür ederim, blogumda kullanıyorum artık :)
YanıtlaSilRica ederim, iyi yıllar şimdiden
Silsüper
YanıtlaSilMobilden bloğu kullandigim.icin headi bulamiyorum aratamiyorum ama olsun güzelmis ellerinize saglk
YanıtlaSilTeşekkürler, farklılık olması için güzel bir kod bencede.
Sildendedim fakat olmadı
YanıtlaSilSiz yorum yaptıktan sonra kodu bir daha denedim ve çalışıyor. Eklerken yanlışlık yapmış olabilir misiniz?
SilÇok güzel bir yazı olmuş teşekkürler. Fakat daha sonra nasıl kaldıracağız. Html bilmiyoruz.
YanıtlaSilKodları eklediğiniz yerden tekrar silerek.
Sil