PHOTO GALLERY ΜΕ SCROLL BAR
Με τον παρακάτω κώδικα
μπορείτε να βάλετε μια photo
gallery μεσα
στην ανάρτησή σας ή στη σελίδα σας ή απλά σαν gadget σε όποιο μέρος
του ιστολογίου σας θέλετε αρκεί να προσαρμόσετε τις διαστάσεις της. Το 1ο
width: 960px; είναι το πλάτος ανάρτησης που διαθέτετε. Τα υπόλοιπα
height:360px;width:190px; είναι το
ύψος και το πλάτος για την κάθε photo
gallery ξεχωριστά.
Τα γαλάζια και πράσινα links των
εικόνων πρέπει να τα αντικαταστήσετε με τα δικά σας.
Στα πράσινα links να προσθέσετε και διαστάσεις όπως έχω προσθέσει στην
πρώτη photo gallery αμέσως μετά τα πράσινα
links εκεί
που γράφει width:160px; height:100px; Αυτό θα σας χρειαστεί
στην περίπτωση που οι φωτογραφίες σας δεν έχουν ενσωματωμένες τις διαστάσεις
μέσα στο url τους όπως έχουν οι δικές μου που είναι από το imgur.com το οποίο προσφέρει 6 διαφορετικές
διαστάσεις για μικρότερο μέγεθος με μία απλή προσθήκη ενός γράμματος στο τέλος
του link της εικόνας.
Το s = 90X90, το b = 160X160, το t =
160 πλάτος Χ αναλογικό ύψος, το m = 320 X αναλογικό ύψος,
το l = 640 X αναλογικό
ύψος, το h = 1024 X αναλογικό ύψος. Δείτε την photo gallery πως θα φαίνεται
ακριβώς κάτω από εδώ. ▼
▲ SAMOS
▲ SAMOS
▲ ASYPALAIA
▲ ASTYPALAIA
▲ ALONNISOS
▲ AIDIPSOS
▲ ITHAKI
▲ KRITI
▲ LEYKADA
▲ LEYKADA
▲ LEYKADA
▲ LEYKADA
▲ LEYKADA
▲ CORFU
▲ AIGINA
▲ ANAFI
▲ POROS
▲ POROS
▲ SANTORINI
▲ SANTORINI
▲ SANTORINI
▲ KERKYRA
▲ KRITI
▲ KRITI
▲ KARPATHOS
▲ SYROS
▲ MYKONOS
▲ ZAKYNTHOS
▲ KEFALONIA
▲ KEFALONIA
▲ MONEMVASIA
▲ MILOS
▲ RODOS
▲ SANTORINI
▲ SIVOTA<div style="width: 960px;">
<div style="float: left; height:360px;width:190px;margin-top:2px;margin-right:2px;overflow:auto;">
<a href="http://i.imgbox.com/9dP2HvKB"
target="_blank"><img src="http://i.imgur.com/ykZzT5Ot.jpg" width:160px; height:100px;/>▲ SAMOS</a>
<a href="http://i.imgbox.com/3XWi0jnI"
target="_blank"><img src="http://i.imgur.com/XZLp5MAt.jpg" width:160px; height:100px;/>▲ SAMOS</a>
<a href="http://i.imgbox.com/E8TQuoGj"
target="_blank"><img src="http://i.imgur.com/uLrZapxt.jpg"/>▲ ASYPALAIA</a>
<a href="http://i.imgbox.com/x39wFzp0"
target="_blank"><img src="http://i.imgur.com/YCL3P4vt.jpg"/>▲ ASTYPALAIA</a>
<a href="http://i.imgbox.com/6IruqU66"
target="_blank"><img src="http://i.imgur.com/9GqSG9at.jpg"/>▲ ALONNISOS</a>
<a href="http://i.imgbox.com/vZMmzLkI"
target="_blank"><img src="http://i.imgur.com/GwVdj0Ut.jpg"/>▲ AIDIPSOS</a>
<a href="http://i.imgbox.com/ZpvJrjg4"
target="_blank"><img src="http://i.imgur.com/JcRaeRSt.jpg"/>▲ ITHAKI</a>
</div>
<div style="float: left; height:360px;width:190px;margin-top:2px;margin-right:2px;overflow:auto;">
<a href="http://i.imgbox.com/kV04fIoO"
target="_blank"><img src="http://i.imgur.com/gptb8xnt.jpg"/>▲ KRITI</a>
<a href="http://i.imgbox.com/MIiFeUzy"
target="_blank"><img src="http://i.imgur.com/gCr4ycDt.jpg"/>▲ LEYKADA</a>
<a href="http://i.imgbox.com/PmqgyMDJ"
target="_blank"><img src="http://i.imgur.com/pyL40yft.jpg"/>▲ LEYKADA</a>
<a href="http://i.imgbox.com/Nvd7I6cH"
target="_blank"><img src="http://i.imgur.com/WeZKATzt.jpg"/>▲ LEYKADA</a>
<a href="http://i.imgbox.com/7XbHpOTN"
target="_blank"><img src="http://i.imgur.com/W09tTTEt.jpg"/>▲ LEYKADA</a>
<a href="http://i.imgbox.com/z5ZhbY0q"
target="_blank"><img src="http://i.imgur.com/RefXdO6t.jpg"/>▲ LEYKADA</a>
<a href="http://i.imgbox.com/CXGR0wf1"
target="_blank"><img src="http://i.imgur.com/wzBRWddt.jpg"/>▲ CORFU</a>
</div>
<div style="float: left; height:360px;width:190px;margin-top:2px;margin-right:2px;overflow:auto;">
<a href="http://i.imgbox.com/vUYYuGhI"
target="_blank"><img src="http://i.imgur.com/c9oYxTHt.jpg"/>▲ AIGINA</a>
<a href="http://i.imgbox.com/uSg2JzVi"
target="_blank"><img src="http://i.imgur.com/h6tthMot.jpg"/>▲ ANAFI</a>
<a href="http://i.imgbox.com/kuNHeoxC"
target="_blank"><img src="http://i.imgur.com/R29XOCZt.jpg"/>▲ POROS</a>
<a href="http://i.imgbox.com/V6XAirZ2"
target="_blank"><img src="http://i.imgur.com/n5IesXRt.jpg"/>▲ POROS</a>
<a href="http://i.imgbox.com/Rct5R9mV"
target="_blank"><img src="http://i.imgur.com/SE7KOHst.jpg"/>▲ SANTORINI</a>
<a href="http://i.imgbox.com/oAmPVZ8O"
target="_blank"><img src="http://i.imgur.com/KwuI9Z2t.jpg"/>▲ SANTORINI</a>
<a href="http://i.imgbox.com/SrKdznto"
target="_blank"><img src="http://i.imgur.com/AunBy7at.jpg"/>▲ SANTORINI</a>
</div>
<div style="float: left; height:360px;width:190px;margin-top:2px;margin-right:2px;overflow:auto;">
<a href="http://i.imgbox.com/x4YtqHsG"
target="_blank"><img src="http://i.imgur.com/Pq9Dexat.jpg"/>▲ KERKYRA</a>
<a href="http://i.imgbox.com/7qUpZcPW"
target="_blank"><img src="http://i.imgur.com/uAMMFyit.jpg"/>▲ KRITI</a>
<a href="http://i.imgbox.com/dyM6m3zW"
target="_blank"><img src="http://i.imgur.com/RyX6tl4t.jpg"/>▲ KRITI</a>
<a href="http://i.imgbox.com/R6GYEpSU"
target="_blank"><img src="http://i.imgur.com/qMMDdhYt.jpg"/>▲ KARPATHOS</a>
<a href="http://i.imgbox.com/LUt5RX51"
target="_blank"><img src="http://i.imgur.com/3sNGgkut.jpg"/>▲ SYROS</a>
<a href="http://i.imgbox.com/JwHSht5d"
target="_blank"><img src="http://i.imgur.com/C83SL17t.jpg"/>▲ MYKONOS</a>
<a href="http://i.imgbox.com/HwIiXvNX.jpg"
target="_blank"><img src="http://i.imgur.com/I9SFA0st.jpg"/>▲ ZAKYNTHOS</a>
</div>
<div style="float: left; height:360px;width:190px;margin-top:2px;margin-right:2px;overflow:auto;">
<a href="http://i.imgbox.com/4jvkDVTA"
target="_blank"><img src="http://i.imgur.com/XMS6PHst.jpg"/>▲ KEFALONIA</a>
<a href="http://i.imgbox.com/efSM91gc"
target="_blank"><img src="http://i.imgur.com/zcIUR7Lt.jpg"/>▲ KEFALONIA</a>
<a href="http://i.imgbox.com/InTTRRkC"
target="_blank"><img src="http://i.imgur.com/loTsDgRt.jpg"/>▲ MONEMVASIA</a>
<a href="http://i.imgbox.com/6CibblTz"
target="_blank"><img src="http://i.imgur.com/w9qsfyQt.jpg"/>▲ MILOS</a>
<a href="http://i.imgbox.com/rMcsofyY"
target="_blank"><img src="http://i.imgur.com/xHwALvDt.jpg"/>▲ RODOS</a>
<a href="http://i.imgbox.com/IogT1Dv6"
target="_blank"><img src="http://i.imgur.com/ADKyUh1t.jpg"/>▲ SANTORINI</a>
<a href="http://i.imgbox.com/0Bkv5X68"
target="_blank"><img src="http://i.imgur.com/uFoNudkt.jpg"/>▲ SIVOTA</a>
</div></div>
