Ads 468x60px

Παρασκευή, 5 Μαΐου 2017

Google Plus Widget With Hover Effect

Φίλες και φίλοι γεια σας, σε αυτή την ανάρτηση θα δούμε ένα widget για την online
κοινότητα μας στην πλατφόρμα 
της Google,  το Google+


Έχει κουμπί προσθήκης για τους κύκλους μας στο Google plus 
και διαθέτει και hover
effect όταν κάνουμε mouseover με τον κέρσορα μας!







 Πηγαίνετε blogger--> Διάταξη -->

Προσθήκη gadget-->HTML/JavaScript 

και στο παράθυρο που θα ανοίξει


 επικολλήστε τον ακόλουθο κώδικα--
..............................................................................................................................................................
<style>
.avdhootbloggerdemo{
margin: 10px auto;
background-color: #ffffff;
width: 260px;
padding: 10px 0 10px 10px;
height: 255px;
overflow: hidden;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
border: 10px solid #000000;
}
.avdhootbloggerdemo:hover {
border: 10px solid #054542;
background-image: linear-gradient(bottom, rgb(5,69,66) 13%, rgb(19,186,189) 55%);
background-image: -o-linear-gradient(bottom, rgb(5,69,66) 13%, rgb(19,186,189) 55%);
background-image: -moz-linear-gradient(bottom, rgb(5,69,66) 13%, rgb(19,186,189) 55%);
background-image: -webkit-linear-gradient(bottom, rgb(5,69,66) 13%, rgb(19,186,189) 55%);
background-image: -ms-linear-gradient(bottom, rgb(5,69,66) 13%, rgb(19,186,189) 55%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.13, rgb(5,69,66)),
color-stop(0.55, rgb(19,186,189))
);
}
// Professional google plus widget with hover effect by www.avdhootblogger.com //
</style>
<div class="avdhootbloggerdemo">
<div class="g-plus" data-action="followers" data-height="280" data-href="GOOGLE URL LINK" data-source="blogger:blog:followers" data-width="280"></div>
</div
....................................................................................................................................................................
ΑΛΛΑΓΕΣ

Βάζετε το url που έχετε στο google plus και πατάτε Αποθήκευση!!


Καλή επιτυχία!!! 


Πηγή κώδικα 
thanks to avdhootblogger.com





Edit by

0 σχόλια :

Δημοσίευση σχολίου

Icon Icon Icon

spice up your blog