ΚΑΘΕΤΟ ROLL DOWN MENU ΜΕ STYLE

ΚΑΘΕΤΟ ROLL DOWN MENU ΜΕ STYLE
Αυτό το roll down menu έχει 2 διαφορές από το προηγούμενο. Πρώτον έχει στρογγυλεμένες γωνίες και δεύτερον ανοίγει στο ίδιο παράθυρο. Πηγαίνουμε στην διάταξη του blog μας και πατάμε προσθήκη gadget στην αριστερή πλαϊνή πλευρική μπάρα. Μετά επίλέγουμε το gadget HTML/JAVASCRIPT και επικολλάμε τον παρακάτω κώδικα. Μπορείτε να αλλάξετε τις κατηγορίες των συνδέσμων αντικαθιστώντας τα πορτοκαλί γράμματα. Επίσης μπορείτε να αλλάξετε και τους συνδέσμους μέσα στις κατηγορίες με τα κίτρινα γράμματα, καθώς και την περιγραφή τους με τα πράσινα γράμματα. Το πλάτος και το ύψος του μενού το ρυθμίζετε αλλάξοντας τα γαλάζια νούμερα.
Το backround του μενού το αλλάζετε με αυτό της αρεσκείας σας, αλλάζοντας τον έχρωμο κωδικό χρώματος μετά την λέξη BACKGROUND και το σύμβολο #. Το χρώμα κειμένου του μενού το αλλάζετε με αυτό της αρεσκείας σας, αλλάζοντας τον κωδικό μετά τη λέξη color και το σύμβολο #. Τους κωδικούς των χρωμάτων μπορείτε να τους βρείτε στο υποσέλιδο αυτού του ιστολογίου σε ένα ειδικό widget που υπάρχει τέρμα κάτω δεξιά.

<style>

.demo select {border: 0 !important; -webkit-appearance: none; -moz-appearance: none;text-indent: 0.01px;text-overflow: ""; border-radius: 6px;padding: 4px;}

</style>

<form class="demo">

<select onchange="location = this.options[this.selectedIndex].value;" style="width:240px;  BACKGROUND:#760991; color:#FFFFFF" name="menu"><option/> ΚΥΛΙΟΜΕΝΑ TEXT LINK IMAGES<!-- change the links with your own -->

<option value="http://the-best-widgets.blogspot.gr/2013/12/blog-post.html"/>ΠΩΣ ΒΑΖΩ ΚΥΛΙΟΜΕΝΟ ΚΕΙΜΕΝΟ

<option value="http://the-best-widgets.blogspot.gr/2014/05/links.html"/>ΠΩΣ ΒΑΖΩ ΚΥΛΙΟΜΕΝΑ LINKS

<option value="http://the-best-widgets.blogspot.gr/2013/04/gif.html"/>ΠΩΣ ΒΑΖΩ ΜΙΑ ΚΙΝΟΥΜΕΝΗ ΕΙΚΟΝΑ GIF

<option value="http://the-best-widgets.blogspot.gr/2014/05/blog-post.html"/>ΚΥΛΙΟΜΕΝΟ ΚΕΙΜΕΝΟ ΜΕ ΓΝΩΜΙΚΑ

<option value="http://the-best-widgets.blogspot.gr/2014/11/links.html"/>ΚΥΛΙΟΜΕΝΑ LINKS ΜΕ ΠΡΟΤΕΙΝΟΜΕΝΑ ΑΡΘΡΑ

<option value="http://the-best-widgets.blogspot.gr/2014/05/link.html"/>ΠΩΣ ΒΑΖΩ ΚΥΛΙΟΜΕΝΕΣ ΕΙΚΟΝΕΣ ΜΕ LINKS</select></form>

<form class="demo">

<select onchange="location = this.options[this.selectedIndex].value;" style="width:240px; BACKGROUND:#207907; color:#FFF" name="menu"><option/> ΟΡΙΖΟΝΤΙΑ ΚΑΙ ΚΑΘΕΤΑ ΜΕΝΟΥ<!-- change the links with your own -->

<option value="http://the-best-widgets.blogspot.gr/2013/04/blog-post.html"/>ΠΩΣ ΒΑΖΩ ΟΡΙΖΟΝΤΙΟ ΜΕΝΟΥ

<option value="http://the-best-widgets.blogspot.gr/2013/07/roll-down.html"/>ΠΩΣ ΒΑΖΩ ROLL DOWN MENU

<option value="http://the-best-widgets.blogspot.gr/2014/05/scrol-bar-blog-gadget.html"/>ΠΩΣ ΒΑΖΩ ΚΑΘΕΤΟ ΜΕΝΟΥ ΜΕ SCROL BAR

<option value="http://the-best-widgets.blogspot.gr/2013/05/blog-post.html"/>ΠΩΣ ΒΑΖΩ ΟΡΙΖΟΝΤΙΟ ΜΕΝΟΥ ΜΕ ΥΠΟΜΕΝΟΥ

<option value="http://the-best-widgets.blogspot.gr/2014/11/orizontio-menu.html"/>ΟΡΙΖΟΝΤΙΟ ΜΕΝΟΥ ΜΕ ΥΠΟΜΕΝΟΥ ΣΑΝ GADGET

<option value="http://the-best-widgets.blogspot.gr/2014/11/horizontal-menu-fb.html"/>ΟΡΙΖΟΝΤΙΟ ΜΕΝΟΥ ΜΕ ΥΠΟΜΕΝΟΥ ΑΠΛΟ</select></form>

<form class="demo">

<select onchange="location = this.options[this.selectedIndex].value;" style="width:240px;  BACKGROUND:#33FFFF; color:#000000" name="menu"><option/>SOSIAL BOOKMARKS BUTTONS<!-- change the links with your own -->

<option value="http://the-best-widgets.blogspot.gr/2014/04/tv-buttons.html"/>ΠΩΣ ΒΑΖΩ TV BUTTONS

<option value="http://the-best-widgets.blogspot.gr/2014/04/radio-buttons.html"/>ΠΩΣ ΒΑΖΩ RADIO BUTTONS

<option value="http://the-best-widgets.blogspot.gr/2014/06/follow-sosial-buttons.html"/>ΠΩΣ ΒΑΖΩ SOSIAL NETWORKS BUTTONS

</select></form>

<form class="demo">

<select onchange="location = this.options[this.selectedIndex].value;" style="width:240px;  BACKGROUND:#F4F004; color:#000000" name="menu"><option/>SLIDESHOWS & GALERIES<!-- change the links with your own -->

<option value="http://the-best-widgets.blogspot.gr/2014/04/video-gallery.html"/>ΠΩΣ ΒΑΖΩ VIDEO GALLERY

<option value="http://the-best-widgets.blogspot.gr/2013/09/photo-gallery.html"/>ΠΩΣ ΒΑΖΩ PHOTO GALLERY

<option value="http://the-best-widgets.blogspot.gr/2014/04/slide-show.html"/>ΠΩΣ ΒΑΖΩ ΚΥΛΙΟΜΕΝΟ SLIDE SHOW

</select></form>

<form class="demo">

<select onchange="location = this.options[this.selectedIndex].value;" style="width:240px;  BACKGROUND:#0F4094; color:#FFFFFF" name="menu"><option/>FACEBOOK WIDGETS<!-- change the links with your own -->

<option value="http://the-best-widgets.blogspot.gr/2013/12/facebook-id.html"/>ΠΩΣ ΒΡΙΣΚΩ ΤΟ FACEBOOK PAGE ID

<option value="http://the-best-widgets.blogspot.gr/2013/04/facebook-pop-up-like-box.html"/>ΠΩΣ ΒΑΖΩ POP UP FACEBOOK LIKE BOX

<option value="http://the-best-widgets.blogspot.gr/2013/04/facebook-floating-like-box.html"/>ΠΩΣ ΒΑΖΩ FACEBOOK FLOATING LIKE BOX

<option value="http://the-best-widgets.blogspot.gr/2014/11/facebook-blog-moy.html"/>ΠΩΣ ΒΑΖΩ ΣΧΟΛΙΑ FACEBOOK ΣΤΟ BLOG ΜΟΥ</select></form>

<form class="demo">

<select onchange="location = this.options[this.selectedIndex].value;" style="width:240px;  BACKGROUND:#9D600A; color:#FFFFFF" name="menu"><option/>ΑΛΛΑ WIDGETS ΓΙΑ BLOGS<!-- change the links with your own -->

<option value="http://the-best-widgets.blogspot.gr/2013/07/widgets-for-all.html"/>ΛΙΣΤΑ ΜΕ ΠΑΝΩ ΑΠΟ 150 WIDGETS

<option value="http://the-best-widgets.blogspot.gr/2014/04/widget_13.html"/> WIDGET ΜΕ ΤΑ ΠΙΟ ΠΡΟΣΦΑΤΑ ΣΧΟΛΙΑ

<option value="http://the-best-widgets.blogspot.gr/2014/04/widget_14.html"/> WIDGET ΜΕΤΡΗΤΗΣ ΑΝΑΡΤΗΣΕΩΝ ΚΑΙ ΣΧΟΛΙΩΝ

<option value="http://the-best-widgets.blogspot.gr/2014/04/widget.html"/>WIDGET ΜΕ ΤΙΣ ΠΙΟ ΠΡΟΣΦΑΤΕΣ ΑΝΑΡΤΗΣΕΙΣ

</select></form>

<form class="demo">

<select onchange="location = this.options[this.selectedIndex].value;" style="width:240px;  BACKGROUND:#961327; color:#FFFFFF" name="menu"><option/>ΜΟΡΦΟΠΟΙΗΣΗ BLOG<!-- change the links with your own -->

<option value="http://the-best-widgets.blogspot.gr/2014/04/blogger.html"/>ΜΟΡΦΟΠΟΙΗΣΗ ΚΕΙΜΕΝΟΥ ΑΝΑΡΤΗΣΗΣ

<option value="http://the-best-widgets.blogspot.gr/2014/05/blog-post_31.html"/>ΠΩΣ ΒΑΖΩ ΑΡΙΘΜΗΣΗ ΣΤΙΣ ΑΝΑΡΤΗΣΕΙΣ ΜΟΥ

<option value="http://the-best-widgets.blogspot.gr/2014/11/arxeiothiki.html"/>ΠΩΣ ΦΤΙΑΧΝΩ ΣΕΛΙΔΑ ΑΡΧΕΙΟΘΗΚΗ ΑΝΑΡΤΗΣΕΩΝ

<option value="http://the-best-widgets.blogspot.gr/2014/04/blog.html"/>ΠΩΣ ΒΑΖΩ ΚΙΝΟΥΜΕΝΟ ΤΙΤΛΟ ΣΤΟ BLOG ΜΟΥ

</select></form>

<form class="demo">

<select onchange="location = this.options[this.selectedIndex].value;" style="width:240px;  BACKGROUND:#333333; color:#FFFFFF" name="menu"><option/>ΑΣΦΑΛΕΙΑ BLOG<!-- change the links with your own -->

<option value="http://the-best-widgets.blogspot.gr/2014/04/blog_28.html"/>ΠΩΣ ΒΑΖΩ ΚΩΔΙΚΟ ΠΡΟΣΒΑΣΗΣ ΣΤΟ BLOG ΜΟΥ

<option value="http://the-best-widgets.blogspot.gr/2014/04/blog-post.html"/>ΠΩΣ ΚΑΝΩ ΑΠΕΝΕΡΓΟΠΟΙΗΣΗ ΣΤΟ ΔΕΞΙ ΚΛΙΚ</select></form>