Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Conectar-se

Esqueci minha senha

Últimos assuntos
Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Os membros mais ativos da semana
Luiz
 
iScroll
 
Gaaratsu
 
Daniel Yan
 
Ketholy
 
Eduardo Lima
 
Shek
 
ranzatti
 
cocas20
 
LucasPofahl
 

Quem está conectado
249 usuários online :: 9 usuários cadastrados, Nenhum Invisível e 240 Visitantes :: 2 Motores de busca

Daniel Yan, DustyRhodes, idarkdg, iScroll, Ketholy, Lemon~, Lost154, Luiz, MateusAnjosV

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

Botões em .CSS

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Botões em .CSS

Mensagem por IsmaelS. em 22/10/15, 08:44 pm

Detalhes da questão


Endereço do fórum: http://master-publicitario.forumeiros.com/
Versão do fórum: PhpBB3

Descrição


Olá!

Eu tentei colocar os botões em .CSS de (Novo Tópico, Responder, Bloqueado) no fórum que tinha antes em PunBB resultava e tinha estes códigos:

.CSS
Código:
.botãoresponder:hover, .botãonovotopico:hover, .botãobloqueado:hover {
box-shadow: 0px 4px 1px rgba(0, 0, 0, 0.19), 0px -3px 0px rgba(0, 0, 0, 0.19) inset;
text-decoration: none;
}
.botãoresponder, .botãonovotopico {
border: medium none;
margin: 10px;
color: #FFF;
display: inline-block;
font: 300 16px/31px "Open Sans","Helvetica Neue",Arial,sans-serif !important;
height: 32px;
padding: 0px 24px;
cursor: pointer;
text-align: center;
text-decoration: none;
text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.25);
white-space: nowrap;
border-radius: 5px;
box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.19), 0px -1px 0px rgba(0, 0, 0, 0.19) inset, 0px 1px 0px 0px rgba(255, 255, 255, 0.19) inset;
background-color: #267CC2;
background-image: linear-gradient(#42A5E1, #267CC2);
transition: all 0.5s ease 0s;
}
.botãobloqueado {
border: medium none;
margin: 10px;
color: #FFF;
display: inline-block;
font: 300 16px/31px "Open Sans","Helvetica Neue",Arial,sans-serif !important;
height: 32px;
padding: 0px 24px;
cursor: pointer;
text-align: center;
text-decoration: none;
text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.25);
white-space: nowrap;
border-radius: 5px;
box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.19), 0px -1px 0px rgba(0, 0, 0, 0.19) inset, 0px 1px 0px 0px rgba(255, 255, 255, 0.19) inset;
background-color: #C22626;
background-image: linear-gradient(#E14242, #C22626);
transition: all 0.5s ease 0s;
}
.botãoresponder:hover, .botãonovotopico:hover, .botãobloqueado:hover {
box-shadow: 0 4px 1px rgba(0,0,0,.19),inset 0 -3px 0 rgba(0,0,0,.19);
text-decoration: none;
}
.botãoresponder:active, .botãonovotopico:active, .botãobloqueado:active, .botãoresponder:focus, .botãonovotopico:focus, .botãobloqueado:focus {
box-shadow: inset 0 2px 0 0 rgba(0,0,0,.19),inset 0 12px 24px 6px rgba(0,0,0,.19),inset 0 0 2px 2px rgba(0,0,0,.19); }
.module .main-content table[style="table-layout:fixed"] {
-moz-animation: progress_bar 2s linear infinite;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
-webkit-animation: progress_bar 2s linear infinite;
-webkit-user-select: none;
animation: progress_bar 2s linear infinite;
background: #fafafa;
background-image: linear-gradient(45deg,rgba(255,255,255,.1)25%,transparent 25%,transparent 50%,rgba(255,255,255,.1)50%,rgba(255,255,255,.1)75%,transparent 75%,transparent);
background-size: 10px 10px;
border: #e1e1e1 1px solid;
border-radius: 3px;
cursor: default;
font-size: 10px;
font-weight: 700;
overflow: hidden;
text-shadow: rgba(0,0,0,.3) 1px 1px 1px;
user-select: none;
}

.jS
Código:
$(document).ready(function(){$('img[src="http://illiweb.com/fa/punbb/post.png"]').replaceWith('<span class="botãonovotopico">Novo Tópico</span>')});
$(document).ready(function(){$('img[src="http://illiweb.com/fa/punbb/reply.png"]').replaceWith('<span class="botãoresponder">Responder</span>')});
$(document).ready(function(){$('img[src="http://illiweb.com/fa/prosilver/button_topic_locked_en.png"]').replaceWith('<span class="botãobloqueado">Bloqueado</span>')});
$(document).ready(function(){$('img[src="http://illiweb.com/fa/subsilver/post_en.gif"]').replaceWith('<span class="botãonovamensagemprivada">Novo Tópico</span>')});

Ao ativar o .jS os botões não aparece nem as imagens, caso saibam o problema agradecia!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões em .CSS

Mensagem por Fraise em 23/10/15, 09:57 am

Olá!

Troque o JS por este e deixe ativo em seu fórum:
Código:
$(document).ready(function() {
    $('img[src="http://illiweb.com/fa/punbb/post.png"]').replaceWith('<div class="botãonovotopico">Novo Tópico</div>')
});
$(document).ready(function() {
    $('img[src="http://illiweb.com/fa/punbb/reply.png"]').replaceWith('<div class="botãoresponder">Responder</div>')
});
$(document).ready(function() {
    $('img[src="http://illiweb.com/fa/prosilver/button_topic_locked_en.png"]').replaceWith('<div class="botãobloqueado">Bloqueado</div>')
});
$(document).ready(function() {
    $('img[src="http://illiweb.com/fa/subsilver/post_en.gif"]').replaceWith('<div class="botãonovamensagemprivada">Novo Tópico</div>')
});

Até mais.
Fraise

Tópico movido de 'Questões sobre a aparência do fórum' para 'Questões sobre códigos'
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5023
Pontos Ativos : 6703

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Botões em .CSS

Mensagem por IsmaelS. em 23/10/15, 12:26 pm

Boa tarde!

@Fraise coloquei amigo mas sem efeito.

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões em .CSS

Mensagem por Fraise em 23/10/15, 12:28 pm

Certo. Coloque o mesmo código que tinha inicialmente pórem com o investimento marcado "Nos sub-fóruns" e veja se resulta.
Código:
$(document).ready(function(){$('img[src="http://illiweb.com/fa/punbb/post.png"]').replaceWith('<span class="botãonovotopico">Novo Tópico</span>')});
$(document).ready(function(){$('img[src="http://illiweb.com/fa/punbb/reply.png"]').replaceWith('<span class="botãoresponder">Responder</span>')});
$(document).ready(function(){$('img[src="http://illiweb.com/fa/prosilver/button_topic_locked_en.png"]').replaceWith('<span class="botãobloqueado">Bloqueado</span>')});
$(document).ready(function(){$('img[src="http://illiweb.com/fa/subsilver/post_en.gif"]').replaceWith('<span class="botãonovamensagemprivada">Novo Tópico</span>')});

Até mais.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5023
Pontos Ativos : 6703

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Botões em .CSS

Mensagem por IsmaelS. em 23/10/15, 12:32 pm

@Fraise quero pedir desculpa pois o código que tinha passado resultou só tinha esquecido de colocar ativo :/ Mas só uma dúvida é possível colocar um ícone ao lado do botão, estes ícones:
- http://astronautweb.co/snippet/font-awesome/

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões em .CSS

Mensagem por Fraise em 23/10/15, 12:37 pm

Sim, é possível. Adicione à sua folha de estilos:
Código:
.botãonovotopico:before {
    content: '\f085 \00A0';
}

.botãobloqueado:before {
    content: '\f085 \00A0';
}

.botãoresponder:before {
    content: '\f085 \00A0';
}

Até mais.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5023
Pontos Ativos : 6703

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Botões em .CSS

Mensagem por IsmaelS. em 23/10/15, 12:41 pm

@Fraise aparece só que não está a reconhecer ou seja aparece ao lado " [] "

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/
  • 0

Resolvido Re: Botões em .CSS

Mensagem por Fraise em 23/10/15, 12:46 pm

Ops.. esqueci de um pequeno pormenor. Troque por este:
Código:
.botãonovotopico:before {
    content: '\f085 \00A0';
    font-family: 'fontawesome';
}

.botãobloqueado:before {
    content: '\f085 \00A0';
    font-family: 'fontawesome';
}

.botãoresponder:before {
    content: '\f085 \00A0';
    font-family: 'fontawesome';
}

Até mais.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5023
Pontos Ativos : 6703

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Botões em .CSS

Mensagem por IsmaelS. em 23/10/15, 12:47 pm

@Fraise perfeito amigo obrigado e desculpe por aquele erro meu.

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Botões em .CSS

Mensagem por Fraise em 23/10/15, 12:48 pm

Sem problema.

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5023
Pontos Ativos : 6703

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum