Menu Que Aumenta 14.12.14 16:39
Em primeiro lugar visualize o menu: aqui
1- Cole os códigos abaixo em seu CSS:
.menuilh {margin-bottom : 1px;font-family: "Script MT Bold"; font-size:16px; letter-spacing : 1px; line-height: auto;text-shadow: 0px 1px 1px #291b2a;background:#291b2a;color:#fff; width:50px;-moz-transition: all 3s ease; -o-transition: all 3s ease; transition: all 3s ease;border-radius:7px;padding:6px;display: inline-block;}
.menuilh:hover {-webkit-transform: scale(1.5) ; -moz-transform: scale(1.5) ; -o-transform: scale(1.5) ; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;transform: scale(1.5);color:#fff;background:#4d424d;-moz-transition: all 3s ease; -o-transition: all 3s ease; transition: all 3s ease;border-radius:7px;padding:6px;}
@font-face {font-family: "Script MT Bold";
src: url("http://static.tumblr.com/mw3v5cd/FYymaipvr/scriptbl.ttf"); /* para IE */
src: local("Script MT Bold"), url("http://static.tumblr.com/mw3v5cd/FYymaipvr/scriptbl.ttf") format("opentype");
}
2- Modifique cores tamanhos e o que mais quiser (background, color, width, font-size...)
3- Coloque o código abaixo onde quiser que o menu apareça:
- se for de links:
<a href="/" class="menuilh">Menu</a>
<a href="/" class="menuilh">Menu</a>
<a href="/" class="menuilh">Menu</a>
<a href="/" class="menuilh">Menu</a>
- se for iframe:
<span onClick="changeNavigation('01')" class="menuilh" >Menu</span>
<span onClick="changeNavigation('02')" class="menuilh" >Menu</span>
<span onClick="changeNavigation('03')" class="menuilh" >Menu</span>
<span onClick="changeNavigation('04')" class="menuilh" >Menu</span>
Salve e veja como ficou !
1- Cole os códigos abaixo em seu CSS:
.menuilh {margin-bottom : 1px;font-family: "Script MT Bold"; font-size:16px; letter-spacing : 1px; line-height: auto;text-shadow: 0px 1px 1px #291b2a;background:#291b2a;color:#fff; width:50px;-moz-transition: all 3s ease; -o-transition: all 3s ease; transition: all 3s ease;border-radius:7px;padding:6px;display: inline-block;}
.menuilh:hover {-webkit-transform: scale(1.5) ; -moz-transform: scale(1.5) ; -o-transform: scale(1.5) ; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;transform: scale(1.5);color:#fff;background:#4d424d;-moz-transition: all 3s ease; -o-transition: all 3s ease; transition: all 3s ease;border-radius:7px;padding:6px;}
@font-face {font-family: "Script MT Bold";
src: url("http://static.tumblr.com/mw3v5cd/FYymaipvr/scriptbl.ttf"); /* para IE */
src: local("Script MT Bold"), url("http://static.tumblr.com/mw3v5cd/FYymaipvr/scriptbl.ttf") format("opentype");
}
2- Modifique cores tamanhos e o que mais quiser (background, color, width, font-size...)
3- Coloque o código abaixo onde quiser que o menu apareça:
- se for de links:
<a href="/" class="menuilh">Menu</a>
<a href="/" class="menuilh">Menu</a>
<a href="/" class="menuilh">Menu</a>
<a href="/" class="menuilh">Menu</a>
- se for iframe:
<span onClick="changeNavigation('01')" class="menuilh" >Menu</span>
<span onClick="changeNavigation('02')" class="menuilh" >Menu</span>
<span onClick="changeNavigation('03')" class="menuilh" >Menu</span>
<span onClick="changeNavigation('04')" class="menuilh" >Menu</span>
Salve e veja como ficou !