Floating Sidebar Widget

ΠΩΣ ΒΑΖΩ ΑΝΑΔΥΟΜΕΝΟ WIDGET No 2

Με τον παρακάτω κώδικα μπορείτε να βάλετε ένα αναδυόμενο widget στα δεξιά ή στα αριστερά του blog σας το οποίο όταν πλησιάζετε το ποντίκι στην άκρη του ιστολογίου σας θα αναδύεται ένα ή περισσότερα widgets. Μπορείτε να βάλετε βίντεο, παρουσιάσεις, έγγραφα word, excel, pdf, ημερολόγια, χάρτες, facebook like box, google+ followers box, chat, forum και γενικώς ότι προσφέρεται σε κώδικα HTML /  javascript. Ο κώδικας των widgets πρέπει να μπεί στο τέλος μεταξύ των <div class="floatingbox"> και του </div>.
Πρέπει δηλαδή να διαγράψετε τον δικό μου κώδικα του φύλλου excel και να βάλετε τον δικό σας κώδικα. Επίσης πρέπει να αλλάξετε τις διαστάσεις με τα γαλάζια γράμματα εκεί που γράφει right: "-510" και width:510px; και την θέση που θα εμφανίζεται το widget εκεί που γράφει top:30px; Προσέξτε αν έχετε ήδη ένα script jquery παραλέιψτε την πρώτη γραμμή του κώδικα.

ΔΕΙΤΕ ΕΔΩ ΤΟ FLOATING WIDGET FOR SIDEBAR ΣΕ ΛΕΙΤΟΥΡΓΙΑ ΣΕ ENA DEMO BLOG

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function() {$(".floatingbox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-510"}, "medium");}, 500);});

</script>

<style>

.floatingbox{

background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOGVAWp-1Y0z3ZRJE3Lg5M7mq27w1aA089eypwrtbsdZI5uNhME-V4gV524jEskD3Bnb4D_Op6eA-Aoe3G4_AE3Xjkg6Cuq-sAOIQ-aQdjMmfow01JucuqHjMOOIcQRMKbuRPcmcp6beK2/w30-h120-no/POSTS.JPG")

no-repeat scroll left top transparent !important;

display:block;float:right;height:auto;padding: 0 0 0 30px;width:510px;

z-index: 99999;position:fixed;right:-510px;top:30px;}

.floatingbox div{border:none;position:relative;display:block;}

</style>

<div class="floatingbox">

<iframe frameborder="0" width="510" height="700"  src="https://docs.google.com/spreadsheets/d/1250n3upxFNUwA50hSL73OZK0fvXv0CHmFF1OTE_443M/pubhtml?gid=898874275&amp;single=true&amp;widget=true&amp;headers=false"></iframe>

</div>