Forma das redes sociais

4 participantes

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

Tópico resolvido Forma das redes sociais

Mensagem por Rivas™ 24.01.12 22:20

Qual é minha questão:
Olá fiz mais ou menos um exemplo da imagem que postei, queria por os icons das Redes Sociais atrás da barra do Menu de Navegação mas escondidos(metade), depois quando passava-se com o mouse em cima os icons das Redes Sociais subiam, isso ja vi em sites, mas agora em Forumeiros nunca..

Queria saber se e possivel.

Medidas que eu tomei para corrigir o problema:
Nenhuma.

Imagens do meu problema:
Forma das redes sociais Semttulovva



Endereço do meu fórum:
www.forum-firto.forumeiros.com

Versão do meu fórum:
PHPBB3
Rivas™

Rivas™
Membro

Membro desde : 31/05/2010
Mensagens : 901
Pontos : 1438

Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por Convidad 25.01.12 2:02

Olá,

Forma das redes sociais F77L
Vá em:
Painel de controle Seta curta Visualização Seta curta Cores Seta curta "Aba" Folha CSS.



Adicione no conteúdo:

Código:
#bookmarks{float:left!important;left: -56px!important;
position: relative;}

Caso necessário modifique o valor: "56" que se encontra no código.
Se não funcionar, coloque aqui o conteúdo de sua folha CSS.

Até mais. Piscada
Anonymous

Convidad
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por Rivas™ 25.01.12 18:26

Nao resultou nem apareceu anda os icons das redes sociais nao fizeram o que queria.
Rivas™

Rivas™
Membro

Membro desde : 31/05/2010
Mensagens : 901
Pontos : 1438

Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por Convidad 26.01.12 0:17

Boa noite,

Poderia me mandar o conteúdo de sua folha CSS (na íntegra) ?

Obrigado,
Até mais. Piscada
Anonymous

Convidad
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por Rivas™ 26.01.12 20:17

Ja enviei
Rivas™

Rivas™
Membro

Membro desde : 31/05/2010
Mensagens : 901
Pontos : 1438

Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por Rivas™ 26.01.12 21:43

Aqui tá 1 exemplo:

http://www.ngt-gaming.org/

Veja os icons das redes sociais ...
Rivas™

Rivas™
Membro

Membro desde : 31/05/2010
Mensagens : 901
Pontos : 1438

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Forma das redes sociais

Mensagem por MateusV. 26.01.12 21:56

Olá, você quer os icones atraz do menu certo? poderia me enviar o codigo que usa para colocar esses icones?
MateusV.

MateusV.
Membro Entusiasta
Membro Entusiasta

Membro desde : 30/10/2011
Mensagens : 7017
Pontos : 9284

http://mateusv.site11.com/gerador2.html

Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por Rivas™ 26.01.12 22:39

Sim queria por atras mas quando passar com o Mouse em cima deles eles levantassem
Rivas™

Rivas™
Membro

Membro desde : 31/05/2010
Mensagens : 901
Pontos : 1438

Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por cyllaz 04.02.12 10:31

caraca, deu até dó de seus UPs hauahuhhahuah
vocÊ é persistente ^^

olha o codigo em estrutura que você quer acredito ser este...
falta adicionar sua imagens, e o efeito acredito que deva ser com Script, mas não tenho certeza...

vou ver o que eu consigo fazer com esse código...

Código:
<div style="float:left; width:496px; padding-left:4px;"><a href="http://www.esl.eu/pt/team/6042633/"><img src="img/social/esl.png" width="34" height="28" style="padding-right:3px;" onmouseover="this.src='img/social/esl_hv.png';" onmouseout="this.src='img/social/esl.png';"></a><a href="http://www.facebook.com/pages/nGt-Gaming/201807806529536"><img src="img/social/face.png" width="34" height="28" style="padding-right:3px;" onmouseover="this.src='img/social/face_hv.png';" onmouseout="this.src='img/social/face.png';"></a><a href="mailto:geral@ngt-gaming.org"><img src="img/social/mail.png" width="34" height="28" style="padding-right:3px;" onmouseover="this.src='img/social/mail_hv.png';" onmouseout="this.src='img/social/mail.png';"></a><a href="http://ngt-gaming.org/tmp/rss.xml"><img src="img/social/rss.png" width="34" height="28" style="padding-right:3px;" onmouseover="this.src='img/social/rss_hv.png';" onmouseout="this.src='img/social/rss.png';"></a><a href="http://steamcommunity.com/groups/nGtGaming"><img src="img/social/steam.png" width="34" height="28" style="padding-right:3px;" onmouseover="this.src='img/social/steam_hv.png';" onmouseout="this.src='img/social/steam.png';"></a><a href="http://twitter.com/#!/ngtgaming"><img src="img/social/twitt.png" width="34" height="28" style="padding-right:3px;" onmouseover="this.src='img/social/twitt_hv.png';" onmouseout="this.src='img/social/twitt.png';"></a><a href="http://www.youtube.com/user/nGtGamingTV"><img src="img/social/youtub.png" width="34" height="28" style="padding-right:3px;" onmouseover="this.src='img/social/youtub_hv.png';" onmouseout="this.src='img/social/youtub.png';"></a><a href="http://webchat.quakenet.org/#nGt-gaming"><img src="img/social/mirc.png" width="34" height="28" style="padding-right:3px;" onmouseover="this.src='img/social/mirc_hv.png';" onmouseout="this.src='img/social/mirc.png';"></a></div>

Edit:
dei uma estudada no efeito deste site e ja intendo o esquema que o cara usa, ele usa um esquema que troca as imagem em hover, de uma imagem menor para uma imagens maior, o que faz parecer que ele esta saindo de trás, mas é só uma ilusão muito criativa ^^
avatar

cyllaz
Membro

Membro desde : 28/11/2009
Mensagens : 890
Pontos : 1258

http://sparquitetura.livreforum.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por cyllaz 06.02.12 3:30

é só colocar as imagens amigo, e usar um CSS que amanha eu te passo ^^
to com sono agora ^^
avatar

cyllaz
Membro

Membro desde : 28/11/2009
Mensagens : 890
Pontos : 1258

http://sparquitetura.livreforum.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por cyllaz 06.02.12 19:48

Desculpem o post duplo, mas estou tentando ajudar...

O codigo é esse...

Código:
/*-----faceboock----*/#id-imagem {width: 60px;height: 60px;
background-image: url('link-imagem');
background-repeat:  no-repeat;}
#id-imagem:hover {width: 60px;height: 60px;
background-image: url('link-imagem');
background-repeat:  no-repeat;}

se precisar de ajuda é só avisar...
avatar

cyllaz
Membro

Membro desde : 28/11/2009
Mensagens : 890
Pontos : 1258

http://sparquitetura.livreforum.com/

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Forma das redes sociais

Mensagem por Luciano98 07.02.12 4:09

Olá!

Substitua o código HTML das redes sociais por esse:
Código:
<style>#page-header .navbar ul.linklist.navlinks{z-index:1}#redesociais{position:absolute;top:250px;right:55px}#redesociais a:hover{position:relative;top:-25px}</style><div id="redesociais"><a href="http://www.facebook.com/pages/Forum-Fritoforumeiroscom/270579949633697" target="_blank"><img src="http://cdn4.iconfinder.com/data/icons/inside/PNG/128x128/icontexto-inside-facebook.png" height="37" width="37"></a><a href="http://twitter.com/#%21/ForumFrito" target="_blank"><img src="http://cdn4.iconfinder.com/data/icons/inside/PNG/128x128/icontexto-inside-twitter.png" height="38" width="38"></a><a href="http://www.youtube.com/user/forumfrito?feature=mhee" target="_blank"><img src="http://cdn4.iconfinder.com/data/icons/inside/PNG/128x128/icontexto-inside-youtube.png" height="36" width="36"></a><a href="http://humor-frito.blogspot.com/" target="_blank"><img src="http://i72.servimg.com/u/f72/13/72/85/95/blogge10.gif" height="37" width="37"></a></div>

Até mais.
Luciano98

Luciano98
Membro Entusiasta
Membro Entusiasta

Membro desde : 02/09/2010
Mensagens : 7647
Pontos : 11049

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por cyllaz 07.02.12 14:46

Muito bom Luciano ^^
mas esse código esta bugando...
fica tremendo e não estático...


Última edição por uzumaki minato em 07.02.12 19:16, editado 1 vez(es)
avatar

cyllaz
Membro

Membro desde : 28/11/2009
Mensagens : 890
Pontos : 1258

http://sparquitetura.livreforum.com/

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Forma das redes sociais

Mensagem por Luciano98 07.02.12 15:56

[quote="uzumaki minato escreveu:Muito com Luciano ^^
mas esse código esta bugando...
fica tremendo e não estático...
Aqui fica normal. Vamos esperar a resposta do autor Piscada
Luciano98

Luciano98
Membro Entusiasta
Membro Entusiasta

Membro desde : 02/09/2010
Mensagens : 7647
Pontos : 11049

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Forma das redes sociais

Mensagem por Rivas™ 07.02.12 21:09

O meu tá perfeito podem conferir:

www.forum-frito.forumeiros.com

Piscada


Resolvido !
Rivas™

Rivas™
Membro

Membro desde : 31/05/2010
Mensagens : 901
Pontos : 1438

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos