2017

Meniu simplu cu efect onmouseover



Am fost intrebat de mai multi prieteni ai acestui blog daca exista un meniu mai simplu pentru al folosi pe blog-urile lor, raspunsul este da. Rezultatul este meniul de sus din acest post.
Pentru inceput mergem la Aspect --> Editare HTML si cautam linia urmatoare: ]]></b:skin> si exact deasupra ei adaugam urmatorul cod:
#menu div.colormenu,
#menu div.colormenu a.menu {
font-family: sans-serif, Verdana, Arial;
font-size: 12pt;
color: white;
}
#menu div.colormenu {
text-align: left;
}
#menu div.colormenu a.menu {
background-color: #0D95F5;
color: white;
cursor: pointer;
padding: 4px 6px 2px 5px;
text-decoration: none;
}
#menu div.colormenu a.menu:hover {
background-color: #940f04;
}

Culorile se pot schimba după cum urmează.
- schimba culoarea de fond: #0D95F5;
- schimba cand trece mouse-ului peste meniu: #940f04;

Salveaza modificarile.

Si la final editeaza un nou gadget HTML/Javascript unde adaugi urmatoarele:
<div id="menu"><div class="colormenu">
<a class="menu" href="#">Text 1</a> <a class="menu" href="#">Text 2</a> <a class="menu" href="#">Text 3</a> <a class="menu" href="#">Text 4</a> <a class="menu" href="#">Text 5</a> <a class="menu" href="#">Text 6</a>
</div></div>

Inlocuieste: "Text 1,2,3,4,5,6" cu textul care doresi sa apara.
Inlocuieste "#" cu URL-ul pagini care doresti sa faca legatura.

0 comentarios:

Trimiteți un comentariu

Bine ai venit!
In continuare poti lasa mesajul tau.

Multumesc