Üzerine Gelince Hareket Eden Sosyal Ağ İkonları

Lütfen fareyi aşağıdaki Facebook sosyal ağ ikon görselinin üzerine getiriniz.



Aşağıdaki kodları kullanarak ikonu kendi sitenizde test edebilirsiniz.

<style type="text/css">
a.cssmouseover {
display:block;
width:200px;
height:300px;
background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNrLCOCRHh4cc9JJCabi7xLUx1MXnsNuXRBa90NGxwzqx57vLBE2f0gTBaLA8eh6IYnfd6a53vInyhZ7yh9cgYouj23RkUSQraAiRyQCWflVs9Sho22KVtk2H_ncy4APh7CIrY3F5hBg/s1600/32x32.gif");
}
a.cssmouseover:hover {
background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnCeWXiMClbWt_mHMU5Oq3ZIOwnSxQflnMx5mF0LlL6f5Y2wL66l2gItaW4Fuqh6evpDvY3aBVokLyzUQibKoCyFmoB6EoA75m2O3l-jTfHjjrUZqSVdqsqEfWJQJ8Bll6qt7OFaNL7A/s1600/facebook.gif")
}
</style>

<a class="cssmouseover" href="https://www.3boyutlogo.blogspot.com" style="height: 32px; width: 32px;"></a>

Hareketli sosyal ağ düğmeleri ile site tasarımını daha dikkat çekici ve beğenilir hale getirebilirsiniz. Bu şekildeki kullanımda yukarıda da test edebileceğiz gibi; sosyal ağ düğmesi sitede sabit şekilde durmaktadır, fare ile üzerine gelindiği zaman hareket eder. Fare üzerinden ayrıldığı zaman tekrar sabit haline geri döner.

Hareketli sosyal ağ ikonlarını setinin bir örneği olan bu çalışmayı sitenizde kullanabilirsiniz. Diğer sosyal ağ hareketli butonları ilerleyen zamanlarda eklenecektir.

Tweet