• SANTORINI

    SANTORINI

  • SANTORINI

    SANTORINI

  • ZAKYNTHOS

    ZAKYNTHOS

  • LEYKADA

    LEYKADA

  • KEFALLONIA

    KEFALLONIA

  • KERKYRA

    KERKYRA

  • RODOS

    RODOS

GADGETS FOR BLOGS

YouTube GITHUB glitch.com JSBIN Start.me JSFIDDLE CODEPLY PASTEBIN.COM Repl.it CODEPEN CODEPEN

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

ΠΩΣ ΒΑΖΩ ΑΝΑΔΥΟΜΕΝΟ WIDGET No 2
Με τον παρακάτω κώδικα μπορείτε να βάλετε ένα αναδυόμενο widget στα δεξιά ή στα αριστερά του blog σας το οποίο όταν πλησιάζετε το ποντίκι στην άκρη του ιστολογίου σας θα αναδύεται το widget. Μπορείτε να βάλετε βίντεο, παρουσιάσεις, έγγραφα word, excel, pdf, ημερολόγια, χάρτες, facebook like box, followers box, chat, forum και γενικώς ότι προσφέρεται σε κώδικα HTMLjavascript. Αν θέλετε να ενωματώσετε διαφορετικο widget αλλάξτε το λίνκ που έχω επισημάνει με κίτρινα γράμματα. 
Επίσης μπορείτε να αλλάξετε τις διαστάσεις με τα γαλάζια γράμματα εκεί που γράφει right: "-510" και width:510px; και την θέση που θα εμφανίζεται το widget εκεί που γράφει top:30px; Προσέξτε αν έχετε ήδη ένα script jquery παραλέιψτε την πρώτη γραμμή του κώδικα.

ΔΕΙΤΕ ΕΔΩ ΤΟ ΣΕ ΛΕΙΤΟΥΡΓΙΑ ΣΕ ENA DEMO ►

<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/AVvXsEhy50GZovsaG_fwac7AB0FqhlwVnTasH9OJxHiWGQrHJV0zYy3wL4uUS_QfBgY8zYZGh2KkC5blhSLWCisfE_vDVz1ezQEHmx856viYHP967l8dweVcYCT_2VrFT17Mr-vCVQefMf-s7YaU/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>

9 σχόλια:

  1. Καλημέρα και καλές γιορτές να έχουμε.
    Έβαλα αυτόν τον κωδικό σου αλλά δεν μου λες με τι να αλλάξω τα νούμερα ( -510 500 30 )
    Μου βγάζει μισό Ρ επάνω δεξιά και πρέπει να πάει εκεί ακριβώς ο κέρσορας για να εμφανίσει το μήνυμα.

    ΑπάντησηΔιαγραφή
  2. Το Blog μου είναι http://arxaiologies.blogspot.com/

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. Στο έφτιαξα. Πάρε τον κώδικα απο εδώ. http://www.w3schools.com/code/tryit.asp?filename=FB50DIX0SWE0
      Εσύ πρέπει να αλλάξεις μόνο το εικονίδιο να λέει on line users αντι posts.

      Διαγραφή
    2. Και πάλι καλημέρα, και καλή χρονιά να έχουμε.
      Κατ’ αρχάς να σε ευχαριστήσω για τον κόπο σου.
      Στο POST την αλλαγή που είπες την έκανα αλλά δεν άλλαξε κάτι, έσβησα δηλαδή στον κώδικα το POST και έγραψα και με πεζά και με κεφαλαία on line users, αλλά τίποτα! Εάν έκανα λάθος πες μου , θέλω επίσης εάν γίνατε να φαίνετε αντί του on line users, το <>
      Ευχαριστώ.

      Διαγραφή
    3. Στο ξαναέφτιαξα με σχετικό εικονίδιο. Δεν μπορούν να μούν γράμματα πρέπει να είναι εικονίδιο. Δες το και πάρε τον κώδικα απο εδώ. http://www.w3schools.com/code/tryit.asp?filename=FB6ICEP4PSSB

      Διαγραφή
  3. Σε ευχαριστώ πολύ καλές γιορτές να έχουμε

    ΑπάντησηΔιαγραφή
  4. kalispera xerei kaneis pos ta widget pou fenontai stin proti selida sti dexia mpara , kapia apo auta pou den thelo na min fenontai kai stin selida pou diavazeis to arthro? diadi alal widget thelo an fenontai stin arxiki selida tou blog kai alal sti selida pou diavazeis to arthro?

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. Δες αυτό το άρθρο και θα καταλάβεις. http://the-best-widgets.blogspot.gr/2015/02/gadgets.html

      Διαγραφή
  5. se eyxaristo tha to prospathiso an theleis steile mou ena email se thelo kati allo mipos analaveis kati mediakiasgr@gmail.com

    ΑπάντησηΔιαγραφή

► Γράψτε το σχόλιό σας στο λευκό κουτί και αν θέλετε να ειδοποιηθήτε για την απάντηση τσεκάρετε το κουτάκι "Να λαμβάνω ειδοποιήσεις".

Σημείωση: Μόνο ένα μέλος αυτού του ιστολογίου μπορεί να αναρτήσει σχόλιο.