Yeni Haberler
recent

Blogger Mouse İmlecine Toz Parçacıkları Eklemek


Saat gecenin 4 ü olmuş hala ayaktayım. Bari bloga yazı yazıyım dedim. Bu yazımda ziyaretçileriniz blogunuza girdiği zaman mouse imlecimizde nasıl toz parçacıkları oluşturabileceğimizi anlatacağım. Aslında yapmamız gereken şey çok basit.

Tasarım > sayfa ögeleri bölümüne geliyoruz ve Html/javascript ekle bölümüne gelip

<script type='text/javascript'>
// <![CDATA[
var sparkles=100;
var colour="black";
var swide=800;
var x=ox=400; var y=oy=300;
var tiny=new Array();
var shigh=600; var sleft=sdown=0;
var starv=new Array();
var star=new Array(); var starx=new Array();
var tinyy=new Array();
var stary=new Array(); var tinyx=new Array();
window.onload=function() { if (document.getElementById) {
var tinyv=new Array(); var i, rats, rlef, rdow;
rats.style.visibility="hidden";
for (var i=0; i<sparkles; i++) { var rats=createDiv(3, 3);
var rats=createDiv(5, 5);
document.body.appendChild(tiny[i]=rats); starv[i]=0; tinyv[i]=0;
var rdow=createDiv(5, 1);
rats.style.backgroundColor="transparent"; rats.style.visibility="hidden"; var rlef=createDiv(1, 5);
rdow.style.top="0px";
rats.appendChild(rlef); rats.appendChild(rdow); rlef.style.top="3px"; rlef.style.left="0px"; rdow.style.left="3px";
ox=x;
document.body.appendChild(star[i]=rats); } set_width(); sparkle(); }} function sparkle() { var c; if (x!=ox || y!=oy) { oy=y;
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
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.visibility="visible"; starv[c]=50;
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
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]) {
star[i].style.visibility="hidden";
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 { starv[i]=0; return; } } else { tinyv[i]=50;
tiny[i].style.visibility="visible"
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"; } } function update_tiny(i) { if (--tinyv[i]==25) {
tiny[i].style.visibility="hidden";
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 { tinyv[i]=0; return; } }
sleft=self.pageXOffset;
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; }
sdown=document.documentElement.scrollTop;
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; } else { sdown=0; sleft=0; } }
else if (document.body.clientWidth) {
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; } swide=document.body.clientWidth;
</script>
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); }
// ]]>

kodlarını eklemek. Herhangi bir sorunda yorum bölümünü kullanabilirsiniz
Unknown

Kurucu Can

Merhaba, Blogger, Wordpress, Tumblr, Google sites uygulama ve yenilikleri hakkında güncel haberler Platformumuza hoşgeldiniz. Yayınlar hakkında yorum yazarak bilgi alabilir, ayrıca Sosyal Medyadan bizi takip edebilirsiniz.

Hiç yorum yok:

Yorum Gönder

Blogger tarafından desteklenmektedir.