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
» Concurso do Dia das Bruxas: Vossas participações
Hoje à(s) 02:16 am por GutaUKP

» Gif na foto do perfil
Ontem à(s) 11:13 pm por dudha

» STAFF ONLINE Widgets
Ontem à(s) 11:04 pm por Luiz

» [Ajuda] HTML & CSS
Ontem à(s) 09:37 pm por Lost154

» Grupos de usuarios
Ontem à(s) 09:06 pm por Gaaratsu

» Erro ao colocar barra de estatisticas
Ontem à(s) 08:21 pm por Luiz

» Avatar no topico
Ontem à(s) 07:35 pm por Luiz

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Quem está conectado
195 usuários online :: 2 usuários cadastrados, Nenhum Invisível e 193 Visitantes :: 2 Motores de busca

AlexG, loveshubby26

[ Ver toda a lista ]


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

Texto em imagem com modo hover

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

Resolvido Texto em imagem com modo hover

Mensagem por naap96 em 01/11/15, 12:44 pm

Detalhes da questão


Endereço do fórum: http://recursosescolares.foruns.com.pt/
Versão do fórum: PunBB

Descrição


Olá!
Como posso criar um widget no fórum com as seguintes características: Uma imagem em forma de circulo com um efeito hover mas em texto? Ou seja quando passar o rato conseguir visualizar o texto. Já andei aqui de volta e sempre que tenho ou não fica a imagem ou fica apenas a imagem.
Obrigada Feliz
avatar

naap96
Nível 1

Feminino
Inscrito dia : 01/11/2015
Mensagens : 3
Pontos Ativos : 5

Ver perfil do usuário http://recursosescolares.foruns.com.pt/

Resolvido Re: Texto em imagem com modo hover

Mensagem por Fraise em 01/11/15, 12:46 pm

Olá!

Você se refere ao efeito tooltip?
E qual seria o texto?

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: Texto em imagem com modo hover

Mensagem por naap96 em 01/11/15, 04:22 pm

Olá! Sim, exato! O texto é uma apresentação dos administradores do fórum. Como Nome, idade, Localização, curiosidade!
Mil obrigadas ^^
avatar

naap96
Nível 1

Feminino
Inscrito dia : 01/11/2015
Mensagens : 3
Pontos Ativos : 5

Ver perfil do usuário http://recursosescolares.foruns.com.pt/

Resolvido Re: Texto em imagem com modo hover

Mensagem por RJUchiha em 02/11/15, 01:02 am

Seria este o eff que vc desejava?:
hover:

Se for adiciune os seguintes codes:
CSS:

Código:
.perfilstaff  {
  display: inline-block;
  position: relative;
}

.perfilstaff  a  {
  display: block;
  position: absolute;
  width: 140px;
  height: 180px;
  background-color: #FFFAFA;
  background-size: 100px;
  opacity: 0;
  font: 11px trebuchet ms;
  color: #111111;
  padding:10px;
  text-align:center;
  text-decoration: none;
  -webkit-transition: all .3s; transition: all .3s;
}

.perfilstaff a:hover  { opacity: 0.6; background-position: 95% 85%; }
.perfilstaff y {
  color:#E32636;
  font: bold 12px trebuchet ms;
}
.perfilstaff x {
  color:#111111;
  font: bold 11px trebuchet ms;
}
Widget:

Código:
<div class="perfilstaff">
        <a href="link do perfil"><br /><y>Nome:</y><x>Texto</x><br /><br /><y>Idade:</y><x>Texto</x><br /><br /><y>Localização:</y><x>Texto</x><br /><br /><y>Curiosidade:</y><x>Texto</x></a><img style="width: 160px; height: 200px;" src="url_da_sua_img" />  
</div>
url_da_sua_img --» Troque pelo link da usa img

Espero ter ajudado ^^
avatar

RJUchiha
Nível 3

Masculino
Inscrito dia : 25/10/2015
Mensagens : 24
Pontos Ativos : 45

Ver perfil do usuário http://narutogamedicasbr.forumeiro.com/

Resolvido Re: Texto em imagem com modo hover

Mensagem por naap96 em 04/11/15, 07:24 am

Sim ajudou! MUUUUITO OBRIGADA!
avatar

naap96
Nível 1

Feminino
Inscrito dia : 01/11/2015
Mensagens : 3
Pontos Ativos : 5

Ver perfil do usuário http://recursosescolares.foruns.com.pt/

Resolvido Re: Texto em imagem com modo hover

Mensagem por Fraise em 04/11/15, 11:08 pm

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

- Tópicos similares

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