GADGETS FOR BLOGS

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

ΚΩΔΙΚΑΣ ΜΕΓΕΝΘΥΣΗΣ ΦΩΤΟΓΡΑΦΙΩΝ Νο 3

ΜΕΓΕΝΘΥΣΗ ΕΙΚΟΝΑΣ
ΚΩΔΙΚΑΣ ΜΕΓΕΝΘΥΣΗΣ ΦΩΤΟΓΡΑΦΙΩΝ Νο 3
Με τον παρακάτω κώδικα μπορούμε περνώντας το ποντίκι μας πάνω από τις φωτογραφίες μας να τις μεγενθύνουμε. Το μέγεθος των μικρών εικόνων το ρυθμίζετε αλλάζοντας τα γαλάζια νούμερα εκεί που γράφει width: 176px; height:110px; Το πόσο θα μεγενθύνεται η φωτογραφία το ρυμθίζετε αλλάζοντας το γαλάζιο νούμερο εκεί που γράφει width:480px; Αν θέλετε πατώντας κλίκ πάνω στην φωτογραφία να ανοίγει σε άλλη θέση μέσα στο ιστολόγιο αλλάξτε τα left:0px; top:30px; Το πρώτο μώβ link είναι της μικρής εικόνας με πλάτος 176px και το δεύτερο μώβ πάλι link είναι της μεγάλης εικόνας με 480px πλάτος. Αυτά τα λίνκ τα αλλάζετε με τα δικά σας link εικόνων.


LEYKADA LEYKADA SKOPELOS SKOPELOS KERKYRA KERKYRA SKIATHOS SKIATHOS POROS POROS

<style>
.pic{width:176px;height:110px;}
.picbig{position: fixed; left:0px; top:30px;width:0px;
-webkit-transition:width 0.3s linear 0s;
transition:width 0.3s linear 0s; z-index:10;}
.pic:hover + .picbig{width:480px;}
</style>
<img class="pic" src="https://lh3.googleusercontent.com/-e9wVddqdevA/VQTFYy8ofyI/AAAAAAAAP_A/6y5US_K3WGM/s176/LEYKADA-42.jpg" title="LEYKADA" alt="LEYKADA">
<img class="picbig" src="https://lh3.googleusercontent.com/-e9wVddqdevA/VQTFYy8ofyI/AAAAAAAAP_A/6y5US_K3WGM/s480/LEYKADA-42.jpg" title="LEYKADA" alt="LEYKADA">
<img class="pic" src="https://lh6.googleusercontent.com/-Wlx9Ii3rPao/Uned84Hf3rI/AAAAAAAAKDc/xb9Rif7AYI4/s176/SKOPELOS-33.jpg" title="SKOPELOS" alt="SKOPELOS">
<img class="picbig" src="https://lh6.googleusercontent.com/-Wlx9Ii3rPao/Uned84Hf3rI/AAAAAAAAKDc/xb9Rif7AYI4/s480/SKOPELOS-33.jpg" title="SKOPELOS" alt="SKOPELOS">
<img class="pic" src="https://lh5.googleusercontent.com/--XVgaOXi3jE/UhTJsPzQPAI/AAAAAAAAI1U/g0V_CnJpb0E/s176/KERKYRA-16.jpg" title="KERKYRA" alt="KERKYRA">
<img class="picbig" src="https://lh5.googleusercontent.com/--XVgaOXi3jE/UhTJsPzQPAI/AAAAAAAAI1U/g0V_CnJpb0E/s480/KERKYRA-16.jpg" title="KERKYRA" alt="KERKYRA">
<img class="pic" src="https://lh5.googleusercontent.com/-JOIQugPPxUU/UnedtKA9PDI/AAAAAAAAKC4/D_akLkG26aI/s176/SKIATHOS-22.jpg" title="SKIATHOS" alt="SKIATHOS">
<img class="picbig" src="https://lh5.googleusercontent.com/-JOIQugPPxUU/UnedtKA9PDI/AAAAAAAAKC4/D_akLkG26aI/s480/SKIATHOS-22.jpg" title="SKIATHOS" alt="SKIATHOS">
<img class="pic" src="https://lh3.googleusercontent.com/-y1w-sRGMQRg/UneWm_85r-I/AAAAAAAAJ18/Qcg6TtNx7HA/s176/POROS-29.jpg" title="POROS" alt="POROS">

<img class="picbig" src="https://lh3.googleusercontent.com/-y1w-sRGMQRg/UneWm_85r-I/AAAAAAAAJ18/Qcg6TtNx7HA/s480/POROS-29.jpg" title="POROS" alt="POROS">

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

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

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