SLIDESHOW ΜΕ 3 ΕΠΙΛΟΓΕΣ ΠΛΟΗΓΗΣΗΣ

SLIDESHOW ΜΕ 3 ΕΠΙΛΟΓΕΣ ΠΛΟΗΓΗΣΗΣ

Το παρακάτω slideshow έχει πολλαπλές επιλογές πλοήγησης. Η πρώτη είναι να πατήσετε το button START για να ξεκινήσει να παρουσιάζει τις εικόνες του, η δεύτερη είναι να πατήσετε το button ►► και να δείτε μία προς μία τις εικόνες που περιέχει και ή τρίτη είναι να επιλέξετε από το αναπτυσόμενο μενού όποια εικόνα θέλετε να προβληθεί. Μπορεί να μπεί σαν gadget σε οποιοδήποτε σημείο του blog μας αρκεί να προσαρμόσουμε τις διαστάσεις του.

Οι διαστάσεις του slideshow μπορούν να αλλάξουν αλλάζοντας τα γαλάζια νούμερα του width και του height στη 8η γραμμή του κώδικα <TABLE> Τα links των εικόνων που πρέπει να αντικαταστήσετε με τα δικά σας links βρίσκονται από την 5η γραμμή εώς την 14η γραμμή του κώδικα script και από την 11η γραμμή εώς την 20η γραμμή του κώδικα <TABLE> και έχουν επισημανθεί με γαλάζιο χρώμα. Θα χρειαστεί όμως να βάλλετε εικόνες από το παλιό google plus ή από το picasa που να έχουν τις διαστάσεις τους μέσα στο url τους. Μπορείτε να το δείτε σε λειτουργία πρίν το βάλετε στο τέλος αυτής της ανάρτησης.

<SCRIPT>

var Onerotate_delay = 3500;

Onecurrent = 0;

var OneLinks = new Array(9);

OneLinks[0] = "http://i.imgur.com/fiVofHI.jpg";

OneLinks[1] = "http://i.imgur.com/rcivwQJ.jpg";

OneLinks[2] = "http://i.imgur.com/0nyxX2L.jpg";

OneLinks[3] = "http://i.imgur.com/gptb8xn.jpg";

OneLinks[4] = "http://i.imgur.com/oSC4D7R.jpg";

OneLinks[5] = "http://i.imgur.com/9GqSG9a.jpg";

OneLinks[6] = "http://i.imgur.com/iMTctrx.jpg";

OneLinks[7] = "http://i.imgur.com/xHwALvD.jpg";

OneLinks[8] = "http://i.imgur.com/2OIqV1b.jpg";

OneLinks[9] = "http://i.imgur.com/Pq9Dexa.jpg";

function Onenext() {if (document.Oneslideform.Oneslide[Onecurrent+1]) {

document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent+1].value;

document.Oneslideform.Oneslide.selectedIndex = ++Onecurrent;}

else Onefirst();}

function Oneprevious() {if (Onecurrent-1 >= 0) {

document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent-1].value;

document.Oneslideform.Oneslide.selectedIndex = --Onecurrent;}

else Onelast();}

function Onefirst() {Onecurrent = 0;

document.images.Oneshow.src = document.Oneslideform.Oneslide[0].value;

document.Oneslideform.Oneslide.selectedIndex = 0;}

function Onelast() {Onecurrent = document.Oneslideform.Oneslide.length-1;

document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent].value;

document.Oneslideform.Oneslide.selectedIndex = Onecurrent;}

function Oneap(text) {document.Oneslideform.Oneslidebutton.value = (text == "STOP") ? "START" : "STOP";

Onerotate();}

function Onechange() {Onecurrent = document.Oneslideform.Oneslide.selectedIndex;

document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent].value;}

function Onerotate() {if (document.Oneslideform.Oneslidebutton.value == "STOP") {

Onecurrent = (Onecurrent == document.Oneslideform.Oneslide.length-1) ? 0 : Onecurrent+1;

document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent].value;

document.Oneslideform.Oneslide.selectedIndex = Onecurrent;

window.setTimeout("Onerotate()", Onerotate_delay);}}

function Onetransport(){window.location=OneLinks[Onecurrent]}

</SCRIPT>

<TABLE border="0" cellspacing="0" cellpadding="0">

<tr><td><form name="Oneslideform"><div align="center">

<table width="650" border="1" cellspacing="0" cellpadding="4" bordercolor="#FBBB22">

<tr><td bgcolor="#115599"><div align="center">

<span style="font:13px arial;color:#FFF;">GREEK ISLANDS TOP 10 BEACHES</span></div></td></tr>

<tr><td bgcolor="#FBBB22"><div align="center">

<a href="javascript:Onetransport()"><img src="http://i.imgur.com/fiVofHIl.jpg" width="640" height="400" name="Oneshow" border="0"></a></div></td></tr>

<tr><td bgcolor="#115599"><div align="center"><select name="Oneslide" onChange="Onechange();">

<option value="http://i.imgur.com/fiVofHIl.jpg" selected>ΖΑΚΥΝΘΟΣ ΝΑΥΑΓΙΟ</option>

<option value="http://i.imgur.com/rcivwQJl.jpg">ΛΕΥΚΑΔΑ ΠΟΡΤΟ ΚΑΤΣΙΚΙ</option>

<option value="http://i.imgur.com/0nyxX2Ll.jpg">ΚΕΦΑΛΟΝΙΑ ΜΥΡΤΟΣ</option>

<option value="http://i.imgur.com/gptb8xnl.jpg">ΚΡΗΤΗ ΜΠΑΛΟΣ</option>

<option value="http://i.imgur.com/oSC4D7Rl.jpg">ΣΚΙΑΘΟΣ ΚΟΥΚΟΥΝΑΡΙΕΣ</option>

<option value="http://i.imgur.com/9GqSG9al.jpg">ΑΛΟΝΝΗΣΟΣ ΚΟΚΚΙΝΟΚΑΣΤΡΟ</option>

<option value="http://i.imgur.com/iMTctrxl.jpg">ΚΑΡΠΑΘΟΣ ΑΠΕΛΛΑ</option>

<option value="http://i.imgur.com/xHwALvDl.jpg">ΡΟΔΟΣ ΤΣΑΜΠΙΚΑ</option>

<option value="http://i.imgur.com/2OIqV1bl.jpg">ΣΑΜΟΣ ΤΣΑΜΑΔΟΥ</option>

<option value="http://i.imgur.com/Pq9Dexal.jpg">ΚΕΡΚΥΡΑ ΠΑΛΙΟΚΑΣΤΡΙΤΣΑ</option>

</select></div></td></tr>

<tr><td bgcolor="#115599"><div align="center">

<input type=button onClick="Oneprevious();" value="◄◄" title="Previous">

<input type=button name="Oneslidebutton" onClick="Oneap(this.value);" value="START ►" title="AutoPlay">

<input type=button onClick="Onenext();" value="►►" title="Next"></div>

</td></tr></table></div></form></td></tr></TABLE>

GREEK ISLANDS TOP 10 BEACHES ΖΑΚΥΝΘΟΣ ΝΑΥΑΓΙΟ ΛΕΥΚΑΔΑ ΠΟΡΤΟ ΚΑΤΣΙΚΙ ΚΕΦΑΛΟΝΙΑ ΜΥΡΤΟΣ ΚΡΗΤΗ ΜΠΑΛΟΣ ΣΚΙΑΘΟΣ ΚΟΥΚΟΥΝΑΡΙΕΣ ΑΛΟΝΝΗΣΟΣ ΚΟΚΚΙΝΟΚΑΣΤΡΟ ΚΑΡΠΑΘΟΣ ΑΠΕΛΛΑ ΡΟΔΟΣ ΤΣΑΜΠΙΚΑ ΣΑΜΟΣ ΤΣΑΜΑΔΟΥ ΚΕΡΚΥΡΑ ΠΑΛΙΟΚΑΣΤΡΙΤΣΑ