GADGETS FOR BLOGS

Facebook Google plus YouTube Pinterest Tumblr Delicius DIIGO Start.me NETVIBES feedburner

ΑΠΛΟ SLIDESHOW ME ΕΝΑΛΛΑΓΗ KEIMENOΥ ΚΑΙ ΕΙΚΟΝΩΝ

SLIDESHOW
ΑΠΛΟ SLIDESHOW ME ΕΝΑΛΛΑΓΗ KEIMENOΥ ΚΑΙ ΕΙΚΟΝΩΝ
Το παρακάτω slideshow ξεκινάει αυτόματα μόνο του και μπορεί να κάνει εναλλαγή μεταξύ κειμένου και εικόνων. Το κείμενο μπορείτε να το βάλετε μόνο στην αρχή ή μόνο στο τέλος ή όπου θέλετε ενδιάμεσα στις εικόνες, ακόμα και να το παραλείψετε. Αλλάξτε τα δικά μου γαλάζια links εικόνων με τα δικά σας links. Αλλάξτε τα κίτρινα κείμενα με δικά σας.
Αλλάξτε τις διαστάσεις του slideshow εκεί που γράφει width:960px; height:600px; και προσέξτε να είναι ίδιες με αυτές των εικόνων σας οι οποίες καλό θα ήταν να έχουν όλες αν όχι την ίδια διάσταση οποσδήποτε όμως την ίδια αναλογία για να ταιριάζουν με τις διαστάσεις του slideshow. Ο χρόνος εναλλαγής μεταξύ των εικόνων αλλάζει εκεί που γράφει .appendTo('#slideshow');},  4000); Δείτε το slideshow σε λειτουργία στο τέλος αυτής της ανάρτησης.


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<div id="slideshow">
<div id="sampletext">ΟΙ 5 ΚΑΛΥΤΕΡΕΣ ΕΛΛΗΝΙΚΕΣ ΠΑΡΑΛΙΕΣ</br>ΠΑΡΑΛΙΑ Νο 1</br>ΝΑΥΑΓΙΟ ΖΑΚΥΝΘΟΣ</div>
<div><img src="http://i.imgur.com/fiVofHI.jpg" alt="ΖΑΚΥΝΘΟΣ" width="960" height="600"></div>    
<div id="sampletext">ΟΙ 5 ΚΑΛΥΤΕΡΕΣ ΕΛΛΗΝΙΚΕΣ ΠΑΡΑΛΙΕΣ</br>ΠΑΡΑΛΙΑ Νο 2</br>ΠΟΡΤΟ ΚΑΤΣΙΚΙ ΛΕΥΚΑΔΑ</div>
<div><img src="http://i.imgur.com/rcivwQJ.jpg" alt="ΛΕΥΚΑΔΑ" width="960" height="600"></div>
<div id="sampletext">ΟΙ 5 ΚΑΛΥΤΕΡΕΣ ΕΛΛΗΝΙΚΕΣ ΠΑΡΑΛΙΕΣ</br>ΠΑΡΑΛΙΑ Νο 3</br>ΜΥΡΤΟΣ ΚΕΦΑΛΛΟΝΙΑ</div>
<div><img src="http://i.imgur.com/0nyxX2L.jpg" alt="ΚΕΦΑΛΛΟΝΙΑ" width="960" height="600"></div>
<div id="sampletext">ΟΙ 5 ΚΑΛΥΤΕΡΕΣ ΕΛΛΗΝΙΚΕΣ ΠΑΡΑΛΙΕΣ</br>ΠΑΡΑΛΙΑ Νο 4</br>ΚΟΥΚΟΥΝΑΡΙΕΣ ΣΚΙΑΘΟΣ</div>
<div><img src="http://i.imgur.com/oSC4D7R.jpg" alt="ΣΚΙΑΘΟΣ" width="960" height="600"></div>
<div id="sampletext">ΟΙ 5 ΚΑΛΥΤΕΡΕΣ ΕΛΛΗΝΙΚΕΣ ΠΑΡΑΛΙΕΣ</br>ΠΑΡΑΛΙΑ Νο 5</br>ΠΑΝΟΡΜΟΣ ΣΚΟΠΕΛΟΣ</div>
<div><img src="http://i.imgur.com/Rh3e0w6.jpg" alt="ΣΚΟΠΕΛΟΣ" width="960" height="600"></div></div>

<style>
#sampletext {position:relative; width:960px; height:600px;font :bold 48px Arial;background:#115599;color:#FFF;}
#slideshow > div {position:relative;top: 0px;left: 0px;right: 0px;bottom: 0px;}
</style>

<script>
$("#slideshow > div:gt(0)").hide();
setInterval(function() {$('#slideshow > div:first')
.fadeOut(0)
.next()
.fadeIn(0)
.end()
.appendTo('#slideshow');},  4000);
</script>



ΟΙ 5 ΚΑΛΥΤΕΡΕΣ ΕΛΛΗΝΙΚΕΣ ΠΑΡΑΛΙΕΣ
ΠΑΡΑΛΙΑ Νο 1
ΝΑΥΑΓΙΟ ΖΑΚΥΝΘΟΣ
ΖΑΚΥΝΘΟΣ
ΟΙ 5 ΚΑΛΥΤΕΡΕΣ ΕΛΛΗΝΙΚΕΣ ΠΑΡΑΛΙΕΣ
ΠΑΡΑΛΙΑ Νο 2
ΠΟΡΤΟ ΚΑΤΣΙΚΙ ΛΕΥΚΑΔΑ
ΛΕΥΚΑΔΑ
ΟΙ 5 ΚΑΛΥΤΕΡΕΣ ΕΛΛΗΝΙΚΕΣ ΠΑΡΑΛΙΕΣ
ΠΑΡΑΛΙΑ Νο 3
ΜΥΡΤΟΣ ΚΕΦΑΛΛΟΝΙΑ
ΚΕΦΑΛΛΟΝΙΑ
ΟΙ 5 ΚΑΛΥΤΕΡΕΣ ΕΛΛΗΝΙΚΕΣ ΠΑΡΑΛΙΕΣ
ΠΑΡΑΛΙΑ Νο 4
ΚΟΥΚΟΥΝΑΡΙΕΣ ΣΚΙΑΘΟΣ
ΣΚΙΑΘΟΣ
ΟΙ 5 ΚΑΛΥΤΕΡΕΣ ΕΛΛΗΝΙΚΕΣ ΠΑΡΑΛΙΕΣ
ΠΑΡΑΛΙΑ Νο 5
ΠΑΝΟΡΜΟΣ ΣΚΟΠΕΛΟΣ
ΣΚΟΠΕΛΟΣ

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

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

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