• 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

BODY BACKGROUND SLIDER-4

BACKGROUND SLIDER
BODY BACKGROUND SLIDER-4
Αυτό το body slider μπορεί να μπεί μέσα σε ένα HTML / JAVASCRIPT gadget κουτάκι που υπάρχει στην διάταξη του blog σας είτε σε πλευρική μπάρα είτε στο υποσέλιδο, αλλά μπορεί επίσης να μπεί και μέσα στον κώδικα HTML του blog σας πρίν την ετικέτα </head>.
Απλά αντιγράψτε και επικολλήστε τον παρακάτω κώδικα σε όποιοδήποτε gadget θέλετε ή μέσα στον κυρίως κώδικα του blog σας αλλάζοντας αν θέλετε τα πράσινα links των εικόνων με τα links των εικόνων της αρεσκείας σας. Ένα άλλο που μπορείτε να ρυθμίσετε αν θέλετε είναι το κάθε πότε θα αλλάζουν. Αυτό μπορείτε να το αλλάξετε 3 γραμμες πριν το τέλος του κώδικα που γράφει setTimeout(nextBackground, 4000);} και ξανά στην επόμενη γραμμή που γράφει setTimeout(nextBackground, 4000); Το 4000 είναι τα milliseconds. Αν θέλετε να προσθέσετε περισσότερες είκόνες πρέπει να βάλετε πρώτα τα link τους εντός του <script>.


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

ΚΩΔΙΚΑΣ ΜΕ 12 ΕΙΚΟΝΕΣ

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(function() {
var body = $('body');
var backgrounds = new Array(
'url(https://i.imgur.com/phbIVY1.jpg)',
'url(https://i.imgur.com/Jrw6vMy.jpg)',
'url(https://i.imgur.com/KGh0xkb.jpg)',
'url(https://i.imgur.com/kmCowJw.jpg)',
'url(https://i.imgur.com/QDoQ4pG.jpg)',
'url(https://i.imgur.com/6W5A1Bg.jpg)',
'url(https://i.imgur.com/XYTN2eD.jpg)',
'url(https://i.imgur.com/OLZZEyp.jpg)',
'url(https://i.imgur.com/LXa5y1y.jpg)',
'url(https://i.imgur.com/LzQtV55.jpg)', 
'url(https://i.imgur.com/wIBlr1Z.jpg)',
'url(https://i.imgur.com/JJWRsYq.jpg)');
var current = 0;
function nextBackground() {
body.css('background', backgrounds[current = ++current % backgrounds.length]);
setTimeout(nextBackground, 4000);}
setTimeout(nextBackground, 4000);
body.css('background', backgrounds[0]);});
</script>

Δεν υπάρχουν σχόλια:

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

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

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