Tech Time: Add Floating Spoiler Menu

TRANSLATUM

Μία πολύ χρήσιμη online εφαρμογή είναι
το Translatum το οποίο μας βοηθά να μεταφράσουμε λέξεις και κείμενα μέσα από πάρα πολλά λεξικά!Δεν θέλει εγκατάσταση απλά πατήστε στην εικόνα για να μεταφερθείτε στην ιστοσελίδα του Translatum, επιλέξτε

ότι σας ενδιαφέρει και πατήστε Μετάφραση!

Τρίτη 14 Μαΐου 2013

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 πηγαίνει πιο δεξιά μέσα στο tempate μας πάντα!Το ίδιο γίνεται και με το center:0px; Εάν αλλάξουμε το 0 το μενού αλλάζει θέση!!

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

Demo

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

Edit by vaiol!!!