Data/hora atual: 19.03.24 10:33
4 resultados encontrados para submenu
Fazer o Navbar Sticky funcionar
Boas!Creio que não funcionou pois as classes do seu menu estão diferentes com a do código.
Por exemplo, no código temos:
" // TARGET NODES BY VERSION
// PHPBB2 : .bodyline > table + table
// PHPBB3 : #page-header .navlinks
// PUNBB : #pun-navlinks
// INVISION : #submenu"
E no seu fórum a classe do menu é ".navi". Poderiamos fazer a transição, mas na minha opinião poderia dar Bugs no seu template, isto é, se funcionar.
Quer tentar?
Abraços!
- em 17.01.18 15:21
- Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
- Tópico: Fazer o Navbar Sticky funcionar
- Respostas: 12
- Vistos: 1083
Espaço entre tópicos
Aqui está.- Folha de estilo:
- a[href="/u"] strong, a[href="/u113"] strong, a[href="/u2"] strong, a[href="/u2"] strong, a[href="/u3"] strong, a[href="/u4"] strong {
background: transparent!important;
padding-left: 0px!important;
}
a[href="/u"] strong, a[href="/u6"] strong {
background: transparent!important;
padding-left: 0px!important;
}
.post-footer {
background-color: #1c1c1c;
border-top: transparent!important;
clear: both;
}
.post-container{color: #c3cdcd;}
body {
/* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
font-family: Arial;
color: #ffffff;
background: #0b0b0b;
background-repeat:repeat-x y;
font-size: 11px; /* This sets the default font size to be equivalent to 10px */
margin: 0;
}
body.ltr {
margin:0px;
margin-top:0px;
padding:0px;
}
#wrapheader {
height: auto !important;
padding: 0;
margin-left:auto;
margin-right:auto;
width:99%;
}
#wrapcentre {
margin-left:auto;
margin-right:auto;
width:99%;
}
#wrapnav {
width: 100%;
margin: 0;
background-color: #ECECEC;
border-width: 1px;
border-style: solid;
border-color: #A9B8C2;
}
#logodesc {
background-color: #C1CAD2;
background-image: url('http://missing.hi2.ro/missing.html');
background-repeat: repeat-x;
background-position: center bottom;
padding: 0 25px 15px 25px;
}
#menubar {
margin: 0 25px;
}
#datebar {
margin: 10px 25px 0 25px;
}
#findbar {
width: 100%;
margin: 0;
padding: 0;
border: 0;
}
.forumrules {
background-color: #101010;
border-width: 1px;
border-style: dashed;
border-color: #00a7de;
padding: 4px;
font-weight: normal;
font-size: 1.1em;
font-family: tahoma;
}
.forumrules h3 {
color: red;
}
#pageheader { }
#pagecontent { }
#pagefooter { }
#poll { }
#postrow { }
#postdata { }
/* Links
------------ */
/* Links adjustment to correctly display an order of rtl/ltr mixed content */
.rtl a {
direction: rtl;
unicode-bidi: embed;
}
a:link {
color: #ffffff;
text-decoration: none;
font-size:11px;
}
a:active,
a:visited {
color: #ffffff;
text-decoration: none;
font-size:11px;
}
a:hover { text-transform: none !important;}
a.forumlink {
color: #ffffff;
font-weight: bold;
font-family: tahoma;
font-size: 1.2em;
}
a.forumlink:hover {
color: #ffffff;
font-weight: bold;
font-family: tahoma;
font-size: 1.2em;
text-decoration:none;
}
a.topictitle {
margin: 1px 0;
font-family: tahoma;
font-weight: bold;
font-size: 11px;
color:#ffffff;
}
a.topictitle:hover {
color: ##ffffff;
text-decoration: none;
}
a.topictitle:visited {
color: #ffffff;
text-decoration: none;
}
th {
}
th a,
th a:visited {
color: #ffffff !important;
text-decoration: none;
}
.text-shadow-tabel-stanga-index {
font-size:11px;
}
th a:hover {
text-decoration: none;
}
/* Form Elements
------------ */
form {
margin: 0;
padding: 0;
border: 0;
text-transform:none;
}
input {
color: #000000;
font-family: tahoma;
font-size: 1.1em;
font-weight: normal;
padding: 1px;
border: 1px solid #A9B8C2;
background-color: #FAFAFA;
}
textarea {
background-color: #1c1c1c;
color: #646464;
font-family: tahoma;
font-size: 1.3em;
line-height: 1.4em;
font-weight: normal;
border: 1px solid #1c1c1c;
padding: 2px;
}
select {
color: #C2C7CC;
background-color: #1c1c1c;
font-family: tahoma;
font-size: 11px;
font-weight: normal;
border: 1px solid #1c1c1c;
padding: 1px;
}
option {
padding: 0 1em 0 0;
}
option.disabled-option {
color: graytext;
}
.rtl option {
padding: 0 0 0 1em;
}
input.radio {
border: none;
background-color: #1c1c1c;
}
.post {
background-color: #lclclc;
border-bottom: 0px solid #C1C6CB!important;
border-color: #lclclc;
border-style: solid;
border-width: 1px;
color: transparent;
}
.btnbbcode {
color: #lclclc;
font-weight: normal;
font-size: 1.1em;
font-family: tahoma;
background-color: #1c1c1c;
border: 1px solid #1c1c1c;
}
.btnmain {
font-weight: bold;
background-color: #1c1c1c;
border: 1px solid #ba6f16;
cursor: pointer;
padding: 1px 5px;
font-size: 1.1em;
color:#ffffff;
}
.btnmain:hover {
font-weight: bold;
background-color: #1c1c1c;
border: 1px solid #00a7de;
cursor: pointer;
padding: 1px 5px;
font-size: 1.1em;
color:#646464;
}
.btnlite {
font-weight: normal;
background-color: #1c1c1c;
border: 1px solid #2a2a2a;
cursor: pointer;
padding: 1px 5px;
font-size: 1.1em;
color:#ffffff;
}
.btnlite:hover {
font-weight: normal;
background-color: #1c1c1c;
border: 1px solid #646464;
cursor: pointer;
padding: 1px 5px;
font-size: 1.1em;
color:#646464;
}
.btnfile {
font-weight: normal;
background-color: #1c1c1c;
border: 0px solid #1c1c1c;
padding: 1px 5px;
font-size: 1.1em;
color:#646464;
}
.helpline {
background-color: #101010;
border-style: none;
color:#646464;
}
/*Panel Left*/
.panel {
position: absolute;
top: 50px;
left: 0;
display: none;
background:url('http://missing.hi2.ro/missing.html') repeat;
border:1px solid #111111;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
width: 330px;
height: 200px;
padding: 30px 30px 30px 130px;
filter: alpha(opacity=595);
opacity: .95;
}
.panel p{
margin: 0 0 15px 0;
padding: 0;
color: #cccccc;
}
.panel a, .panel a:visited{
margin: 0;
padding: 0;
color: #00a7de;
text-decoration: none;
}
.panel a:hover, .panel a:visited:hover{
margin: 0;
padding: 0;
color: #ffffff;
text-decoration: none;
}
a.trigger{
position: absolute;
text-decoration: none;
top: 80px; left: 0;
font-size: 10px;
text-transform:uppercase;
font-family: tahoma;
color:#00aa00;
padding: 10px 30px 10px 10px;
font-weight: 700;
background:#131313 url('http://missing.hi2.ro/missing.html') 85% 55% no-repeat;
border:1px solid #1c1c1c;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-bottom-left-radius: 0px;
display: block;
}
a.trigger:hover{
position: absolute;
text-decoration: none;
top: 80px; left: 0;
font-size: 10px;
text-transform:uppercase;
font-family: tahoma;
color:#00a7de;
padding: 10px 40px 10px 10px;
font-weight: 700;
background:#222222 url('http://missing.hi2.ro/missing.html') 85% 55% no-repeat;
border:1px solid #444444;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-bottom-left-radius: 0px;
display: block;
}
a.active.trigger {
background:#222222 url('http://missing.hi2.ro/missing.html') 85% 55% no-repeat;
}
.columns{
clear: both;
width: 330px;
padding: 0 0 20px 0;
line-height: 22px;
}
.colleft{
float: left;
width: 100px;
line-height: 22px;
}
.colright{
float: right;
width: 130px;
line-height: 22px;
}
.rosugros {
color: #FF0000;
font-weight: bold;
}
a:link,
a:visited,
a:active{
text-decoration: none;
}
table.ipbtable tfoot td {
background-color:#1d1d1d;
}
div.maintitle .expand,div.maintitle .contract {
float: right;
width: 80px;
height: 20px;
background: url('https://i.servimg.com/u/f47/16/97/85/02/minimi11.png') no-repeat 50% 50%;
cursor: pointer;
}
div.maintitle .expand {
background: url('https://i.servimg.com/u/f47/16/97/85/02/maximi10.png') no-repeat 50% 50%;
}
.popupmenu li {
background-color: #1d1d1d;
}
.box-content {
border-bottom: transparent;
}
table.ipbtable tfoot td {
background-color: transparent;
}
a.mainmenu{
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 1.0;
}
a.mainmenu:hover{
filter:alpha(opacity=50);
-moz-opacity: 0.65;
opacity: 0.55;
}
#submenu ul li a {
margin:0.5em 0 0.65em 0;
padding:0.5em 0 0.65em 0;
}
a:hover{text-transform:uppercase;}
.skills a img{
background: url(https://i.servimg.com/u/f64/14/54/25/26/dwd-gr10.png) no-repeat;}
.skills a img:hover{
background-position: 0px -40px;}
.member {background-color: #1c1c1c !important;}
div#preview div.post-entry {
color: #c3cdcd; !important;
}
table tr td.row2 {
width: 49%;
}
#gfooter {
background-color: transparent !Important;
}
#gfooter .footer-links {
float: center !Important;
}
.ipbform table tr td {
width: 0px!important;
}
.nomedorank {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background: #333333;
border-radius: 3px;
color: white;
display: inline-block;
font-size: 11px;
font-weight: 600;
margin-top: 5px;
padding: 0px 7px;
text-shadow: rgba(0,0,0,0.2) 0 -1px 0;
}
- em 06.06.15 18:04
- Procurar em: Questões resolvidas sobre a aparência do fórum
- Tópico: Espaço entre tópicos
- Respostas: 5
- Vistos: 2927
Problema com separador de mensagens
Aqui está.Aguardando resposta.
- CSS:
a[href="/u"] strong, a[href="/u113"] strong, a[href="/u2"] strong, a[href="/u2"] strong, a[href="/u3"] strong, a[href="/u4"] strong {
background: transparent!important;
padding-left: 0px!important;
}
a[href="/u"] strong, a[href="/u6"] strong {
background: transparent!important;
padding-left: 0px!important;
}
body {
/* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
font-family: Arial;
color: #ffffff;
background: #0b0b0b;
background-repeat:repeat-x y;
font-size: 11px; /* This sets the default font size to be equivalent to 10px */
margin: 0;
}
body.ltr {
margin:0px;
margin-top:0px;
padding:0px;
}
#wrapheader {
height: auto !important;
padding: 0;
margin-left:auto;
margin-right:auto;
width:99%;
}
#wrapcentre {
margin-left:auto;
margin-right:auto;
width:99%;
}
#wrapnav {
width: 100%;
margin: 0;
background-color: #ECECEC;
border-width: 1px;
border-style: solid;
border-color: #A9B8C2;
}
#logodesc {
background-color: #C1CAD2;
background-image: url('http://missing.hi2.ro/missing.html');
background-repeat: repeat-x;
background-position: center bottom;
padding: 0 25px 15px 25px;
}
#menubar {
margin: 0 25px;
}
#datebar {
margin: 10px 25px 0 25px;
}
#findbar {
width: 100%;
margin: 0;
padding: 0;
border: 0;
}
.forumrules {
background-color: #101010;
border-width: 1px;
border-style: dashed;
border-color: #00a7de;
padding: 4px;
font-weight: normal;
font-size: 1.1em;
font-family: tahoma;
}
.forumrules h3 {
color: red;
}
#pageheader { }
#pagecontent { }
#pagefooter { }
#poll { }
#postrow { }
#postdata { }
/* Links
------------ */
/* Links adjustment to correctly display an order of rtl/ltr mixed content */
.rtl a {
direction: rtl;
unicode-bidi: embed;
}
a:link {
color: #ffffff;
text-decoration: none;
font-size:11px;
}
a:active,
a:visited {
color: #ffffff;
text-decoration: none;
font-size:11px;
}
a:hover { text-transform: none !important;}
a.forumlink {
color: #ffffff;
font-weight: bold;
font-family: tahoma;
font-size: 1.2em;
}
a.forumlink:hover {
color: #ffffff;
font-weight: bold;
font-family: tahoma;
font-size: 1.2em;
text-decoration:none;
}
a.topictitle {
margin: 1px 0;
font-family: tahoma;
font-weight: bold;
font-size: 11px;
color:#ffffff;
}
a.topictitle:hover {
color: ##ffffff;
text-decoration: none;
}
a.topictitle:visited {
color: #ffffff;
text-decoration: none;
}
th {
}
th a,
th a:visited {
color: #ffffff !important;
text-decoration: none;
}
.text-shadow-tabel-stanga-index {
font-size:11px;
}
th a:hover {
text-decoration: none;
}
/* Form Elements
------------ */
form {
margin: 0;
padding: 0;
border: 0;
text-transform:none;
}
input {
color: #000000;
font-family: tahoma;
font-size: 1.1em;
font-weight: normal;
padding: 1px;
border: 1px solid #A9B8C2;
background-color: #FAFAFA;
}
textarea {
background-color: #1c1c1c;
color: #646464;
font-family: tahoma;
font-size: 1.3em;
line-height: 1.4em;
font-weight: normal;
border: 1px solid #1c1c1c;
padding: 2px;
}
select {
color: #C2C7CC;
background-color: #1c1c1c;
font-family: tahoma;
font-size: 11px;
font-weight: normal;
border: 1px solid #1c1c1c;
padding: 1px;
}
option {
padding: 0 1em 0 0;
}
option.disabled-option {
color: graytext;
}
.rtl option {
padding: 0 0 0 1em;
}
input.radio {
border: none;
background-color: #1c1c1c;
}
.post {
background-color: #lclclc;
border-style: solid;
border-width: 1px;
border-color: #lclclc;
color:#c2c7cc;
}
.btnbbcode {
color: #lclclc;
font-weight: normal;
font-size: 1.1em;
font-family: tahoma;
background-color: #1c1c1c;
border: 1px solid #1c1c1c;
}
.btnmain {
font-weight: bold;
background-color: #1c1c1c;
border: 1px solid #ba6f16;
cursor: pointer;
padding: 1px 5px;
font-size: 1.1em;
color:#ffffff;
}
.btnmain:hover {
font-weight: bold;
background-color: #1c1c1c;
border: 1px solid #00a7de;
cursor: pointer;
padding: 1px 5px;
font-size: 1.1em;
color:#646464;
}
.btnlite {
font-weight: normal;
background-color: #1c1c1c;
border: 1px solid #2a2a2a;
cursor: pointer;
padding: 1px 5px;
font-size: 1.1em;
color:#ffffff;
}
.btnlite:hover {
font-weight: normal;
background-color: #1c1c1c;
border: 1px solid #646464;
cursor: pointer;
padding: 1px 5px;
font-size: 1.1em;
color:#646464;
}
.btnfile {
font-weight: normal;
background-color: #1c1c1c;
border: 0px solid #1c1c1c;
padding: 1px 5px;
font-size: 1.1em;
color:#646464;
}
.helpline {
background-color: #101010;
border-style: none;
color:#646464;
}
/*Panel Left*/
.panel {
position: absolute;
top: 50px;
left: 0;
display: none;
background:url('http://missing.hi2.ro/missing.html') repeat;
border:1px solid #111111;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
width: 330px;
height: 200px;
padding: 30px 30px 30px 130px;
filter: alpha(opacity=595);
opacity: .95;
}
.panel p{
margin: 0 0 15px 0;
padding: 0;
color: #cccccc;
}
.panel a, .panel a:visited{
margin: 0;
padding: 0;
color: #00a7de;
text-decoration: none;
}
.panel a:hover, .panel a:visited:hover{
margin: 0;
padding: 0;
color: #ffffff;
text-decoration: none;
}
a.trigger{
position: absolute;
text-decoration: none;
top: 80px; left: 0;
font-size: 10px;
text-transform:uppercase;
font-family: tahoma;
color:#00aa00;
padding: 10px 30px 10px 10px;
font-weight: 700;
background:#131313 url('http://missing.hi2.ro/missing.html') 85% 55% no-repeat;
border:1px solid #1c1c1c;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-bottom-left-radius: 0px;
display: block;
}
a.trigger:hover{
position: absolute;
text-decoration: none;
top: 80px; left: 0;
font-size: 10px;
text-transform:uppercase;
font-family: tahoma;
color:#00a7de;
padding: 10px 40px 10px 10px;
font-weight: 700;
background:#222222 url('http://missing.hi2.ro/missing.html') 85% 55% no-repeat;
border:1px solid #444444;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-bottom-left-radius: 0px;
display: block;
}
a.active.trigger {
background:#222222 url('http://missing.hi2.ro/missing.html') 85% 55% no-repeat;
}
.columns{
clear: both;
width: 330px;
padding: 0 0 20px 0;
line-height: 22px;
}
.colleft{
float: left;
width: 100px;
line-height: 22px;
}
.colright{
float: right;
width: 130px;
line-height: 22px;
}
.rosugros {
color: #FF0000;
font-weight: bold;
}
a:link,
a:visited,
a:active{
text-decoration: none;
}
table.ipbtable tfoot td {
background-color:#1d1d1d;
}
div.maintitle .expand,div.maintitle .contract {
float: right;
width: 80px;
height: 20px;
background: url('https://i.servimg.com/u/f47/16/97/85/02/minimi11.png') no-repeat 50% 50%;
cursor: pointer;
}
div.maintitle .expand {
background: url('https://i.servimg.com/u/f47/16/97/85/02/maximi10.png') no-repeat 50% 50%;
}
.popupmenu li {
background-color: #1d1d1d;
}
.box-content {
border-bottom: transparent;
}
table.ipbtable tfoot td {
background-color: transparent;
}
.post {
border-bottom:10px solid #1d1d1d;
}
a.mainmenu{
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 1.0;
}
a.mainmenu:hover{
filter:alpha(opacity=50);
-moz-opacity: 0.65;
opacity: 0.55;
}
#submenu ul li a {
margin:0.5em 0 0.65em 0;
padding:0.5em 0 0.65em 0;
}
a:hover{text-transform:uppercase;}
.skills a img{
background: url(https://i.servimg.com/u/f64/14/54/25/26/dwd-gr10.png) no-repeat;}
.skills a img:hover{
background-position: 0px -40px;}
#gfooter {
background-color: transparent !Important;
}
#gfooter .footer-links {
float: center !Important;
}
- em 27.04.15 18:06
- Procurar em: Questões resolvidas sobre a aparência do fórum
- Tópico: Problema com separador de mensagens
- Respostas: 23
- Vistos: 2940
Efeito de opacidade nas imagens do menu
Este tutorial irá lhe ensinar como poderá deixar a imagem do menu de navegação do seu fórum com diferentes níveis de cor, variando de uma cor total até uma cor mais opaca. Como o menu principal é um ponto onde muitos membros acedem, é interessante que seja feita algumas modificações no mesmo.--> Tutoriais e astúcias <--
Efeito de opacidade nas imagens do menu
Efeito de opacidade nas imagens do menu
1º - Teremos de aceder à "Folha de estilo CSS":
Para que possamos personalizar as caixas de texto do Fórum, é necessário adicionar códigos CSS para criarmos o efeito desejado, sendo assim, teremos de aceder a:
Painel administrativo -> Visualização -> Imagens e cores -> Cores -> Folha de estilo CSS
[table class=table1][tr][td vAlign=top width="30px"][/td][td] Ver o CSS da base do seu fórum - Permite o administrador conferir o estilo padrão do CSS do fórum. Mesmo se você tiver aplicado algum código CSS na folha de estilo, esse CSS base não será alterado. Ele mostra os códigos que personalizam seu fórum sem a necessidade do CSS adicional, que no caso serial a da folha de estilo.[/td][/tr][/table][table class=table1][tr][td vAlign=top width="30px"][/td][td] Procurar CSS - Com essa ferramenta, podemos fazer uma busca nos códigos existentes na folha de estilo CSS. Por exemplo, se você adicionou algum código na folha de estilo, e pelo fato dela ser muito grande você não estiver encontrando o código desejado, a partir do momento em que digitar o código no campo "Procurar CSS", o código será encontrado (se digitado corretamente).[/td][/tr][/table][table class=table1][tr][td vAlign=top width="30px"][/td][td] Desativar o CSS de base - Caso desabilite essa opção, o CSS base do seu fórum será desativado, deixando apenas o CSS da folha de estilo.[/td][/tr][/table][table class=table1][tr][td vAlign=top width="30px"][/td][td] Melhorar seu CSS - Com essa função ativa, a capacidade de carregamento da página é aumentada, facilitando a navegação nas páginas de seu fórum. Mas é importante lembrar que, para que a função funcione normalmente como prometida, você terá que adicionar o código correto na folha de estilo.[/td][/tr][/table]
Segue a tua versão, pois cada versão tem um código diferente. referimos-nos ás versões: PhpBB 2, PhpBB 3, PunBB e Invision. |
2º - Ter uma noção de CSS para modifcar á opacidade:
Antes de adicionarmos o código, temos de saber o que estamos a personalizar, pois teremos um efeito diferente para cada estado da imagem, um quando a mesma estiver normal e outra quando o mouse estiver sobre ela.
Para que possa compreender como terá de estruturar o seu código, quando após a indicação da classe adicionamos o sufixo:
Isso indica que este efeito será aplicado quando o mouse estiver sobre a secção envolvida pela classe. Existem outros indicadores além deste demonstrado mas, como não é nosso objetivo agora, ficaremos somente com este.:hover
Para as imagens, iremos utilizar estas propriedades:
filter:alpha(opacity=X);
-moz-opacity: Y;
opacity: Y;
Vermelho -> Deverá definir um valor entre 0 e 100, o 0 será totalmente opaco e o 100 seria a iamgem normal. Esta propriedade funcionará somente para o Internet Explorer 7 ou superior.
Violeta -> Será o valor explicado acima dividido por 100 (entre 0 e 1, sendo que valores intermédios, são por exemplo 0.5), estas propriedades serão responsáveis por aplicar este efeito em navegadores como Mozilla Firefox para a primeira propriedade e para Opera e Internet Explorer 6 ou inferior, etc, para a segunda propriedade.
3º - Agora deverão copiar o código correspondere à versão:
Tendo em conta a versão, e como as classes variam consoante estas, deverse-à escolher a que se adequa ao Fórum onde será aplicada:
PhpBB 2 |
|
PhpBB 3 |
|
PunBB |
|
Invision |
|
4º - Definir o menu apenas com imagens (sem texto):
Para podermos definir um menu disposto apenas por imagens, devemos aceder a:
Painel administrativo -> Visualização -> Home Page -> Cabeçalho & Navegação
E na opção: "Exibir apenas as imagens no menu de navegação", optam pela opção "Sim".
5º - Vejamos agora um exemplo:
Imaginemos que pretendemos colocar uma Fórum na versão PhpBB 3, com o menu normal com 40% de opacidade e quando estiver o mouse sobre o menu que este esteja 100%, ou seja com a cor real. Neste caso utilizaríamos o código:
Por comparação será mais fácil agora construírem o vosso código de forma a poderem dar o efeito de opacidade que pretenderem. Como é óbvio poderão fazer um efeito contrário, o menu ter a cor real e quando o mouse estiver sobre ele, a imagem perder a cor, para isso basta trocar os códigos, definindo para o não hover a opacidade de 100.ul.linklist li a img {
filter:alpha(opacity=40);
-moz-opacity: 0.4;
opacity: 0.4;
}
ul.linklist a img:hover {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}
Vejamos um exemplo de um tema que dispõe deste efeito:
PHPBB3 Hi-Tech
:copyright: Fórum dos Fóruns
Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: Efeito de opacidade nas imagens do menu |
- em 27.05.09 1:43
- Procurar em: Topo do fórum
- Tópico: Efeito de opacidade nas imagens do menu
- Respostas: 0
- Vistos: 11492