Aplicar css/html nas mensagens

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

Resolvido Aplicar css/html nas mensagens

Mensagem por Firenando em 17/08/12, 10:58 am

Qual é minha questão:
Olá a todos, eu gostaria de saber, como fazer um efeito nas mensagens com CSS/HTML.

Por ex, eu faço tutoriais de HTML e CSS, e gostaria de fazer o efeito que eu ensino no tutorial.

Por ex, esse que acabei de fazer.

Código:
    <img title="Firenando" src="http://upamais.com/images/72160684001332132291.png" style="opacity: 0.5;" onmouseover="this.style.opacity=1;" onmouseout="this.style.opacity=0.5;" />

Seria HTML, eu gostaria de colocar esse código, e o efeito ser feito, que seria a opacidade.

Espero que tenham entendido.

Obrigado.

Links e imagens do meu problema:
Não precisa.

Endereço do meu fórum:
http://br-designerforever.forumeiros.com

Versão do meu fórum:
PHPBB3
avatar

Firenando
Membro do Fórum

Masculino
Inscrito dia : 22/10/2011
Mensagens : 1665
Pontos Ativos : 2318

Ver perfil do usuário http://divineartz.forumeiros.com/

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por Oto! em 17/08/12, 11:01 am

Olá Firenando!

O que você gostaria de fazer? Não seria somente usar o style="propriedades" no HTML, quando abrimos o "Inspecionar elemento" existe um local ao lado com as seguintes informações "element.style", a partir deste você personaliza o local, depois disso é somente editar e copiar o código em HTML.

Até mais.
Piscada
avatar

Oto!
Hiperativo

Inscrito dia : 07/04/2011
Mensagens : 3363
Pontos Ativos : 4818

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por Firenando em 17/08/12, 11:05 am

Bom, eu copio e colo o HTML, mais ele não surge efeito.

Já tentei com várias Tags e não funciona.

Creio que é o meu JS do Ant-Owner que está bloqueando o style=.

Seria isso?

Obrigado.
avatar

Firenando
Membro do Fórum

Masculino
Inscrito dia : 22/10/2011
Mensagens : 1665
Pontos Ativos : 2318

Ver perfil do usuário http://divineartz.forumeiros.com/

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por Oto! em 17/08/12, 11:13 am

Olá novamente!

Seu HTML está ativado? Cheque em Painel de controle > Geral > Mensagens > Configuração, procure por permitir HTML.

Sobre o código de bloquear CSS nas mensagens, pedi que o Admineiro Luciano98 averigue o caso(Se interfere ou não o código do tutorial).

Até mais.
Piscada
avatar

Oto!
Hiperativo

Inscrito dia : 07/04/2011
Mensagens : 3363
Pontos Ativos : 4818

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por Firenando em 17/08/12, 11:22 am

Sim, está ativado, sempre olho tudo antes de vir " tomar " o tempo de vocês Piscada.

Vou ver em meu fórum de testes, sem esse JS para ver se funciona, e já venho falar.

Obrigado.

Edit: Não funcionou nem com JS desativado...
avatar

Firenando
Membro do Fórum

Masculino
Inscrito dia : 22/10/2011
Mensagens : 1665
Pontos Ativos : 2318

Ver perfil do usuário http://divineartz.forumeiros.com/

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por MateusV. em 18/08/12, 04:53 pm

Olá!

Isto não é erro, é padrão, códigos Js não são aceitos nos posts, ou seja, o navegador não irá ler qualquer código, creio eu que seja uma medida de segurança, já que existem várias maneiras de invadir e criar algumas "falhas" em seu fórum atravez de Javascript, todavia existe um serviço de hospedamento de códigos chamado de Jsbin, nele poderá colocar os códigos que o senhor usa para seus tutorias e o senhor terá uma visão do resultado automaticamente, sem precisar nem mesmo criar uma conta, peço que cheque este link:
http://jsbin.com/

Abraços. Piscada
avatar

MateusV.
Principal contribuidor
Principal contribuidor

Inscrito dia : 30/10/2011
Mensagens : 7017
Pontos Ativos : 9289

Ver perfil do usuário http://mateusv.site11.com/gerador2.html

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por Firenando em 18/08/12, 11:05 pm

Bom, eu fiz tudo certinho, aqui está o JS.

http://jsbin.com/ivipeg/1

Mais como eu faço para ele aparecer na minha mensagem agora?

Obrigado.
avatar

Firenando
Membro do Fórum

Masculino
Inscrito dia : 22/10/2011
Mensagens : 1665
Pontos Ativos : 2318

Ver perfil do usuário http://divineartz.forumeiros.com/

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por Luciano98 em 19/08/12, 03:01 am

Olá!

Você pode fazer esse mesmo efeito utilizando CSS:
Código:
<style>#firenandoavatar:hover{opacity:1}</style><img id="firenandoavatar" title="Firenando" src="http://upamais.com/images/72160684001332132291.png" style="opacity: 0.5;">

Até mais.
avatar

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 01/09/2010
Mensagens : 7648
Pontos Ativos : 11045

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por Firenando em 19/08/12, 01:22 pm

Esse não funciona Luciano...
avatar

Firenando
Membro do Fórum

Masculino
Inscrito dia : 22/10/2011
Mensagens : 1665
Pontos Ativos : 2318

Ver perfil do usuário http://divineartz.forumeiros.com/

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por MateusV. em 20/08/12, 01:42 pm

@Firenando escreveu:Bom, eu fiz tudo certinho, aqui está o JS.

http://jsbin.com/ivipeg/1

Mais como eu faço para ele aparecer na minha mensagem agora?

Obrigado.

Olá!

Como eu citei anteriormente não se pode adicionar na mensagem, o que você pode fazer é mandar o link do código no Jsbin em seu tutorial.

Abraços. Piscada
avatar

MateusV.
Principal contribuidor
Principal contribuidor

Inscrito dia : 30/10/2011
Mensagens : 7017
Pontos Ativos : 9289

Ver perfil do usuário http://mateusv.site11.com/gerador2.html

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por Firenando em 20/08/12, 08:10 pm

Olá, sim é possível, aqui está um forum forumeiros que tem esse efeito.

Seta http://spdesign.ativoforum.com/t2538-tutorial-efeito-opacidade-no-avatar-ao-passar-o-mouse-no-post

Veja no resultado o efeito.

Obrigado.
avatar

Firenando
Membro do Fórum

Masculino
Inscrito dia : 22/10/2011
Mensagens : 1665
Pontos Ativos : 2318

Ver perfil do usuário http://divineartz.forumeiros.com/

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por MateusV. em 20/08/12, 08:12 pm

Olá!

Mas o código é feito com CSS e não com javascript, basta o senhor adicionar no seu post:
<img class="hover" src="http://r21.imgfast.net/users/2612/28/77/07/avatars/41920-33.png" />

E em seu CSS:
.hover:hover {
opacity: 1;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
}
.hover {
opacity: 0.7;
}

Abraços. Piscada
avatar

MateusV.
Principal contribuidor
Principal contribuidor

Inscrito dia : 30/10/2011
Mensagens : 7017
Pontos Ativos : 9289

Ver perfil do usuário http://mateusv.site11.com/gerador2.html

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por DetonaGames em 20/08/12, 08:17 pm

cara eu te entendo nos tutoriais FdF eles fazem isso eu tbm quero fazer isso no meu fórum

avatar

DetonaGames
Nível 8

Masculino
Inscrito dia : 02/07/2012
Mensagens : 114
Pontos Ativos : 177

Ver perfil do usuário http://detonagames.livreforum.com/

Resolvido Re: Aplicar css/html nas mensagens

Mensagem por Firenando em 21/08/12, 07:19 pm

Chandler escreveu:Olá!

Mas o código é feito com CSS e não com javascript, basta o senhor adicionar no seu post:
<img class="hover" src="http://r21.imgfast.net/users/2612/28/77/07/avatars/41920-33.png" />

E em seu CSS:
.hover:hover {
opacity: 1;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
}
.hover {
opacity: 0.7;
}

Abraços. Piscada

Obrigado, com isso tive uma iideia para meu fórum.

E o outro poste, antes desse aqui, um usuário postou uma coisa nada a ver... Flood...

Obrigado, pode fechar o tópico.
avatar

Firenando
Membro do Fórum

Masculino
Inscrito dia : 22/10/2011
Mensagens : 1665
Pontos Ativos : 2318

Ver perfil do usuário http://divineartz.forumeiros.com/

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

- Tópicos similares

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