InícioSistema de pré-visualizar em HTML
4 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1 • Compartilhe
Sistema de pré-visualizar em HTML
por IsmaelS. 19.09.16 21:18
Detalhes da questão
Endereço do fórum: www.suportedesign.forumeiros.com
Versão do fórum: PunBB
Descrição
Olá!
Tenho uma página em HTML e queria que ao passar o mouse em cada avatar abri-se um tipo pré-visualizar com uma imagem à minha escolha, algo como isto:
Deixo aqui a seção: http://suportedesign.forumeiros.com/f73-psd-s, isso apenas é um exemplo porque quando passar o mouse por cima dos avatares a imagem que aparecer será a que eu colocar no código.
Código HTML:
- Código:
<style>
body {
background-attachment: fixed;
background-color: #171714;
background-image: url(https://i.imgur.com/AeiKmy6.png);
color: #000;
font-family: Roboto;
font-size: 10px;
height: auto;
padding: 10px 0;
}
#pjtempo {
background: #f8f8f8;
position: fixed;
padding: 20px;
width: 925px;
display: none;
top: 50%;
left: 50%;
margin-top: -240px;
margin-left: -482.5px;
box-shadow: 6px 6px 10px #333;
}
.titulotex3 {
background: url(http://i.imgbox.com/y6oNBDsU.png);
height: 40px;
padding: 40px;
width: 845px;
color: #f5f5f5;
font-family: roboto;
font-size: 14px;
font-weight: 900;
height: 16px;
letter-spacing: 3px;
line-height: 100%;
margin-bottom: 5px!important;
text-align: right;
text-transform: uppercase;
}
.cuerpotp {
background: #f9f9f9;
border: 1px solid #ccc;
color: #141414;
font-family: Roboto;
font-size: 11px;
line-height: 110%;
padding: 18px;
text-align: center;
width: 890px;
height: 350px;
overflow: auto;
}
.icono {
width: 100px;
height: 100px;
border: 3px solid #fff;
outline: 1px solid #e5e5e5;
margin: 1px;
display: inline-block;
vertical-align: top;
}
.high {
width: 100px;
height: 100px;
opacity: 0;
transition-duration: 0.8s;
 -moz-transition-duration: 0.8s;
 -webkit-transition-duration: 0.8s;
 -o-transition-duration: 0.8s;
}
.canontitle {
width: 100px;
height: 100px;
font-family: calibri;
font-size: 8px;
text-align: center;
color: #fff;
text-transform: uppercase;
line-height: 100%;
padding-top: 30px;
}
.lastname {
width: 100px;
font-family: 'Montserrat';
font-size: 14px;
text-transform: uppercase;
letter-spacing: -1px;
line-height: 100%;
}
.firstname {
width: 100px;
font-family: roboto;
font-size: 10px;
text-transform: lowercase;
color: #fff;
font-style: italic;
line-height: 100%;
}
.high {
width: 100px;
height: 100px;
opacity: 0;
transition-duration: 0.8s;
 -moz-transition-duration: 0.8s;
 -webkit-transition-duration: 0.8s;
 -o-transition-duration: 0.8s;
}
.high:hover {
width: 100px;
height: 100px;
opacity: 0.8;
background-color: #464F3B
}
.logo {
margin-top: 55px;
}
</style>
<center><img src="http://i35.servimg.com/u/f35/18/07/03/67/logosd10.png" class="logo"></center>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet" type="text/css" /> <link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet" type="text/css" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Hall of Fame</title> <div id="pjtempo" style="display: block;">
<div class="titulotex3">
HALL OF FAME ● CREATIONS OF THE WEEK
</div>
<div class="cuerpotp">
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/lucas10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">LucasRPG</span><br /><span class="firstname">COTW #1</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/lucas10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">LucasRPG</span><br /><span class="firstname">COTW #2</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/reborn10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Reborn</span><br /><span class="firstname">COTW #3</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/naruto10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Naruto</span><br /><span class="firstname">COTW #4</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/reborn10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Reborn</span><br /><span class="firstname">COTW #5</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/reborn10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Reborn</span><br /><span class="firstname">COTW #6</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/stark10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Stark'</span><br /><span class="firstname">COTW #7</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/naruto10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">David_David</span><br /><span class="firstname">COTW #8</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/chrome10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Chrome'</span><br /><span class="firstname">COTW #9</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/reborn10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Reborn</span><br /><span class="firstname">COTW #10</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/zer10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Zero</span><br /><span class="firstname">COTW #11</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/kamika10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Kamikaze</span><br /><span class="firstname">COTW #12</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/zer10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Zero</span><br /><span class="firstname">COTW #13</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/zer10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Zero</span><br /><span class="firstname">COTW #14</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/zer10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Zero</span><br /><span class="firstname">COTW #16</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
</div>
</div>
Página HTML: http://suportedesign.forumeiros.com/h4-hall-of-fame
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Sistema de pré-visualizar em HTML
por Hancki 22.09.16 21:48
Olá!
Apenas com CSS podemos fazer isso.
Adicione este código abaixo na sua página HTML:
Esse número 1 equivale ao primeiro avatar. Logo abaixo da linha onde encontra isso, tem um link de uma imagem, que será a que aparece ao lado.
Para colocar no segundo avatar, tem que adicionar novo código abaixo do que lhe forneci acima, assim:
Tem que adicionar este código sempre para uma nova imagem e mudar o número, correspondendo à posição do ícone.
Hancki
Apenas com CSS podemos fazer isso.
Adicione este código abaixo na sua página HTML:
- Código:
<style>
.icono:hover {
position: relative;
}
.icono:nth-child(1):hover:after {
content: url(http://i86.servimg.com/u/f86/12/05/75/97/logo_p11.jpg);
display: block;
position: absolute;
left: 123px;
top: -0px;
border: 10px solid black;
}
<style>
Esse número 1 equivale ao primeiro avatar. Logo abaixo da linha onde encontra isso, tem um link de uma imagem, que será a que aparece ao lado.
Para colocar no segundo avatar, tem que adicionar novo código abaixo do que lhe forneci acima, assim:
- Código:
.icono:nth-child(2):hover:after {
content: url(http://i86.servimg.com/u/f86/12/05/75/97/logo_p11.jpg);
display: block;
position: absolute;
left: 123px;
top: -0px;
border: 10px solid black;
}
Tem que adicionar este código sempre para uma nova imagem e mudar o número, correspondendo à posição do ícone.
Hancki
Hancki- Membro Entusiasta
- Membro desde : 03/10/2009
Mensagens : 8194
Pontos : 12249 -
Re: Sistema de pré-visualizar em HTML
por IsmaelS. 22.09.16 22:08
Resultou e ficou óptimo porém o problema é que quando as imagens são grandes os avatares ficam em modo "scroll" veja:
- http://suportedesign.forumeiros.com/h4-hall-of-fame
Não dá para deixar como estava?
- http://suportedesign.forumeiros.com/h4-hall-of-fame
Não dá para deixar como estava?
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Sistema de pré-visualizar em HTML
por Shek 23.09.16 14:33
Olá!
Para mim o scrol não aparece Ismael. Poderia nos enviar uma imagem, por favor?
Para mim o scrol não aparece Ismael. Poderia nos enviar uma imagem, por favor?
Shek- Principal Contribuidor
- Membro desde : 11/04/2009
Mensagens : 18896
Pontos : 22793 -
Re: Sistema de pré-visualizar em HTML
por Hancki 23.09.16 19:30
És ó adicionar mais este CSS:
Hancki
- Código:
.cuerpotp {
overflow: hidden !important;
}
Hancki
Hancki- Membro Entusiasta
- Membro desde : 03/10/2009
Mensagens : 8194
Pontos : 12249 -
Re: Sistema de pré-visualizar em HTML
por IsmaelS. 24.09.16 2:57
Resultou, só tem um pequeno problema veja se calha de ser um avatar grande:
É possível deixar por cima de tudo?
É possível deixar por cima de tudo?
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Sistema de pré-visualizar em HTML
por Hancki 24.09.16 21:52
Substitua o código todo da página por este:
Hancki
- Código:
<style>
body {
background-attachment: fixed;
background-color: #171714;
background-image: url(https://i.imgur.com/AeiKmy6.png);
color: #000;
font-family: Roboto;
font-size: 10px;
height: auto;
padding: 10px 0;
}
#pjtempo {
background: #f8f8f8;
position: fixed;
padding: 20px;
width: 925px;
display: none;
top: 50%;
left: 50%;
margin-top: -240px;
margin-left: -482.5px;
box-shadow: 6px 6px 10px #333;
}
.titulotex3 {
background: url(http://i.imgbox.com/y6oNBDsU.png);
height: 40px;
padding: 40px;
width: 845px;
color: #f5f5f5;
font-family: roboto;
font-size: 14px;
font-weight: 900;
height: 16px;
letter-spacing: 3px;
line-height: 100%;
margin-bottom: 5px!important;
text-align: right;
text-transform: uppercase;
}
.cuerpotp {
background: #f9f9f9;
border: 1px solid #ccc;
color: #141414;
font-family: Roboto;
font-size: 11px;
line-height: 110%;
padding: 18px;
text-align: center;
width: 890px;
height: 350px;
overflow: auto;
}
.icono {
width: 100px;
height: 100px;
border: 3px solid #fff;
outline: 1px solid #e5e5e5;
margin: 1px;
display: inline-block;
vertical-align: top;
}
.high {
width: 100px;
height: 100px;
opacity: 0;
transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-webkit-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
}
.canontitle {
width: 100px;
height: 100px;
font-family: calibri;
font-size: 8px;
text-align: center;
color: #fff;
text-transform: uppercase;
line-height: 100%;
padding-top: 30px;
overflow: visible !important;
}
.lastname {
width: 100px;
font-family: 'Montserrat';
font-size: 14px;
text-transform: uppercase;
letter-spacing: -1px;
line-height: 100%;
}
.firstname {
width: 100px;
font-family: roboto;
font-size: 10px;
text-transform: lowercase;
color: #fff;
font-style: italic;
line-height: 100%;
}
.high {
width: 100px;
height: 100px;
opacity: 0;
transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-webkit-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
}
.high:hover {
width: 100px;
height: 100px;
opacity: 0.8;
background-color: #464F3B
}
.logo {
margin-top: 55px;
}
.icono:hover {
position: relative;
overflow: visible !important;
}
.icono:nth-child(1):hover:after {
content: url(http://i.imgur.com/eDwzn.jpg);
display: block;
position: absolute;
left: 123px;
top: -0px;
border: 10px solid black;
overflow: visible !important;
}
.icono:nth-child(2):hover:after {
content: url(http://i.imgur.com/7tYu4.jpg);
display: block;
position: absolute;
left: 123px;
top: -0px;
border: 10px solid black;
overflow: visible !important;
}
.cuerpotp {
overflow: visible !important;
}
</style>
<center><img src="http://i35.servimg.com/u/f35/18/07/03/67/logosd10.png" class="logo"></center>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet" type="text/css" /> <link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet" type="text/css" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Hall of Fame</title> <div id="pjtempo" style="display: block;">
<div class="titulotex3">
HALL OF FAME â— CREATIONS OF THE WEEK
</div>
<div class="cuerpotp">
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/lucas10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">LucasRPG</span><br /><span class="firstname">COTW #1</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/lucas10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">LucasRPG</span><br /><span class="firstname">COTW #2</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/reborn10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Reborn</span><br /><span class="firstname">COTW #3</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/naruto10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Naruto</span><br /><span class="firstname">COTW #4</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/reborn10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Reborn</span><br /><span class="firstname">COTW #5</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/reborn10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Reborn</span><br /><span class="firstname">COTW #6</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/stark10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Stark'</span><br /><span class="firstname">COTW #7</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/naruto10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">David_David</span><br /><span class="firstname">COTW #8</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/chrome10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Chrome'</span><br /><span class="firstname">COTW #9</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/reborn10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Reborn</span><br /><span class="firstname">COTW #10</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/zer10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Zero</span><br /><span class="firstname">COTW #11</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/kamika10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Kamikaze</span><br /><span class="firstname">COTW #12</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/zer10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Zero</span><br /><span class="firstname">COTW #13</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/zer10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Zero</span><br /><span class="firstname">COTW #14</span>
</div>
</div>
</div>
<div class="icono" style="background: url('http://i97.servimg.com/u/f97/18/07/03/67/zer10.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Zero</span><br /><span class="firstname">COTW #16</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
<div class="icono" style="background: url('https://i.imgur.com/5nRUgQi.png')">
<div class="high">
<div class="canontitle">
<span class="lastname">Nome</span><br /><span class="firstname">COTW #</span>
</div>
</div>
</div>
</div>
</div>
Hancki
Hancki- Membro Entusiasta
- Membro desde : 03/10/2009
Mensagens : 8194
Pontos : 12249 -
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Sistema de pré-visualizar em HTML
por while 25.09.16 16:09
 | Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada. Tópico marcado como Resolvido e movido para "Questões resolvidas". |
while- Hiper Membro
- Membro desde : 24/04/2016
Mensagens : 3263
Pontos : 4761 -
Tópicos semelhantes» Declaro Urgência Help HTML ( Colocar vídeo para tocar automaticamente quando abrir a página de entrada do fórum em HTML Preciso do códico em HTML
» Pré-visualizar na pagina html
» Código HTML do Editor BBCODE ou Html
» Não consigo visualizar o html das mensagend do meu fórum
» Sistema de abas em página HTML
» Pré-visualizar na pagina html
» Código HTML do Editor BBCODE ou Html
» Não consigo visualizar o html das mensagend do meu fórum
» Sistema de abas em página HTML
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos
Facebook
Twitter
Youtube
