Add Floating Spoiler Menu

Σε αυτή την ανάρτηση θα δούμε ένα πολύ όμορφο και εύχρηστο μενού που ξεδιπλώνεται όταν περνάμε τον κέρσορα από πάνω του αλλιώς φαίνεται σαν εικονίδιο!!Η εγκατάσταση του είναι απλή!




Πηγαίνετε blogger--> Διάταξη -->Προσθήκη gadget-->HTML/JavaScript και στο παράθυρο που θα ανοίξει βάλτε τον παρακάτω κώδικα--> 





.............................................................................................................................
<style text-type="CSS">
#bmenu{
position:fixed;
right:10px;
center:0px;
background-color:#000;
border-radius:10px;
-moz-border-radius:10px;
border:1px solid #FFF;
width:202px;
height:20px;
color:#FF0606;
transition:all .5s ease-in;-moz-transition:all .5s ease-in;-webkit-transition:all .5s ease-in;-o-transition:all .5s ease-in;z-index:3;overflow:hidden;padding:9px 15px 10px;}

#bmenu h3{
margin:0;
padding:0;
text-align:center;
cursor:pointer;}

#bmenu ul{
border-radius:10px;-moz-border-radius:10px;
border:2px solid #FFf;
background-color:#FF0606;
margin:15px 0;
padding:0 15px;}

#bmenu li{list-style:none;margin:0 0 5px;padding:0;} #bmenu li a{
color:#000;
text-decoration:none;
font-size:14px;}

#bmenu li a:hover{
color:#fff;}

#bmenu:hover{
z-index:5;
height:175px;
</style>

<div id="bmenu">
<h3>
TITLE</h3>
<ul>
<li><a href="#">FBT-1</a></li>
<li><a href="#">FBT-2</a></li>
<li><a href="#">FBT-3</a></li>
<li><a href="#">FBT-4</a></li>
<li><a href="#">FBT-5</a></li>
</ul>
</div>

...............................................................................................................................................

Εδώ θα σας δείξω τα σημεία στον κώδικα που πρέπει να αλλάξουμε!

TITLE---> Εδώ βάζουμε τον τίτλο που θέλουμε για το μενού!

href="#">όπου # βάζουμε το λίνκ που θέλουμε να ανοίγει κ όπου FBT-1 το όνομα που θέλουμε να φαίνεται!
Αυτά τα 3 σημεία πρέπει να τα αλλάξουμε οπωσδήποτε!Τα άλλα πιο κάτω τα αλλάζει οποίος θέλει και όποιος ξέρει!

right:10px; Right το μενού μπαίνει δεξιά- Left το μενού μπαίνει αριστερά!!Το 10 εάν το αυξήσουμε 
έρχεται το μενού πιο αριστερά ενώ αν βάλουμε -10 πηγαίνει πιο δεξιά μεσα στο teblates μας πάντα!Το ίδιο γίνεται και με το center:0px; Εάν αλλάξουμε το 0 το μενού αλλάζει θέση!!

Υπάρχουν και για ύψος πλάτος χρώματα τιμές μέσα στο κώδικα,οποίος ξέρει τα αλλάζει και αυτά!!
Όταν είστε έτοιμοι πατήστε Αποθήκευση!!


Demo 


Πηγή http://full-tricks.blogspot.gr/


Edit by vaiol!!!