=> ΤΙΤΛΟΣ ΜΕΝΟΥ <=
Φίλοι bloggers, σήμερα σας έχω ένα pop-up-image menu, δηλαδή ενα κάθετο μενου με τίτλους φωτογραφιών που ανοίγουν σε pop up νεο παραθυρο για να τις δούμε, και δεν πιάναι πολύ χώρο, μιάς και αναπτύσεται όταν πατάμε με τον κέρσορα επάνω του...DEMO βλέπετε από πάνω !
Ο ΚΩΔΙΚΑΣ: (Βάλτε τον όλο σαν gadget HTML/Javascript )
<script type="text/javascript">
//<![CDATA[
function display_image(form) {
selectionname = form.drblogger_ImageName.options[form.drblogger_ImageName.selectedIndex].text;
selection = form.drblogger_ImageName.options[form.drblogger_ImageName.selectedIndex].value;
PreView = window.open("", "Preview", "toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=1,resizable=1,copyhistory=0,width=800,height=650");
PreView.document.open();
PreView.document.write("<html><head>");
PreView.document.write("<title>Preview</title>");
PreView.document.write("</head><body bgcolor=ffffff text=000000>");
PreView.document.write("<form><center><b><font size=+1>" +
selectionname + "</font></b><hr>");
PreView.document.write("<img hspace=0 vspace=0 " +
"src='" + selection + "'>");
PreView.document.write("<hr><form><input type='button' value='Close' " +
"onClick='window.close()'></form>");
PreView.document.write("</center>");
PreView.document.write("</body></html>");
PreView.document.close();
}
//]]>
</script>
<b>=> ΤΙΤΛΟΣ ΜΕΝΟΥ <=</b>
<form>
<select name="drblogger_ImageName" onChange="display_image(this.form)" style="font-size:16px;font-family:Times New Roman;font-weight:bold;color:#0040FF;background:#F2F2F2;padding:4px 0 4px 8px;border:2px solid black;-moz-border-radius:8px;border-radius:8px;-webkit-border-radius:8px;-goog-ms-border-radius:8px;text-shadow:1px 1px 1px #eee;">
<option value=" URL EIKONAΣ " selected> ΤΙΤΛΟΣ ΕΙΚΟΝΑΣ
<option value=" URL EIKONAΣ">ΤΙΤΛΟΣ ΕΙΚΟΝΑΣ
<option value=" URL EIKONAΣ">ΤΙΤΛΟΣ ΕΙΚΟΝΑΣ
<option value=" URL EIKONAΣ">ΤΙΤΛΟΣ ΕΙΚΟΝΑΣ
<option value=" URL EIKONAΣ">ΤΙΤΛΟΣ ΕΙΚΟΝΑΣ
<option value=" URL EIKONAΣ">ΤΙΤΛΟΣ ΕΙΚΟΝΑΣ
</select>
</form>
***αλλάξτε τα χρώματα για να ταιριάζουν με τα χρώματα του blog σας
(οι αλλαγες μπορουν να γινουν σε αυτό το σημείο του κώδικα :
<select name="drblogger_ImageName" onChange="display_image(this.form)" style="font-size:16px;font-family:Times New Roman;font-weight:bold;color:#0040FF;background:#F2F2F2;padding:4px 0 4px 8px;border:2px solid black;-moz-border-radius:8px;border-radius:8px;-webkit-border-radius:8px;-goog-ms-border-radius:8px;text-shadow:1px 1px 1px #eee;">
http://www.dr-blogger.com/2013/08/pop-up-image.html#more