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.
Acesso rápido

Fóruns de suporte oficiais
Conectar-se

Esqueci minha senha

Últimos assuntos
» Efeito no avatar em mensagens no tópico
Hoje à(s) 01:34 am por Dark Hunter

» Imagem do topico
Ontem à(s) 11:50 pm por Harleen

» #10422 Forumeiros desativa e reenvia a url para este site
Ontem à(s) 10:39 pm por Forumpw

» [PEDIDO] - Logo
Ontem à(s) 09:38 pm por Tiger

» Caixa de resposta rápida nos tópicos
Ontem à(s) 09:07 pm por Harleen

» Template quebra ao ser editado
Ontem à(s) 08:52 pm por Starset

» Ícones de redes sociais e feed
Ontem à(s) 08:14 pm por Harleen

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Parceiros Forumeiros
Os membros mais ativos da semana
Kyo Panda
 
Fatalisss
 
Harleen
 
JulioPais
 
APOllO
 
Shek
 
Holkis
 
MtX
 
Forumpw
 
Roger_Crazzy
 

Quem está conectado
198 usuários online :: 1 usuário cadastrado, Nenhum Invisível e 197 Visitantes :: 1 Motor de busca

Jefferson105

[ Ver toda a lista ]


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

Sistema de pré-visualizar em HTML

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

Resolvido Sistema de pré-visualizar em HTML

Mensagem por IsmaelS. em 19/09/16, 05:18 pm

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.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2768
Pontos Ativos : 3863

http://master-publicitario.forumeiros.com/

Resolvido Re: Sistema de pré-visualizar em HTML

Mensagem por IsmaelS. em 20/09/16, 09:38 pm

UP!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2768
Pontos Ativos : 3863

http://master-publicitario.forumeiros.com/
  • 0

Resolvido Re: Sistema de pré-visualizar em HTML

Mensagem por Hancki em 22/09/16, 05:48 pm

Olá!

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>
Procure por ".icono:nth-child(1)".
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;
}
Agora já tem o segundo avatar com imagem de pré-visualização.
Tem que adicionar este código sempre para uma nova imagem e mudar o número, correspondendo à posição do ícone.

Hancki
avatar

Hancki
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8041
Pontos Ativos : 12015

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Sistema de pré-visualizar em HTML

Mensagem por IsmaelS. em 22/09/16, 06:08 pm

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?

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2768
Pontos Ativos : 3863

http://master-publicitario.forumeiros.com/

Resolvido Re: Sistema de pré-visualizar em HTML

Mensagem por Shek em 23/09/16, 10:33 am

Olá!

Para mim o scrol não aparece Ismael. Poderia nos enviar uma imagem, por favor?


ShekAdmineiro - Fórum dos Fóruns
Clicar no botão ou no OBRIGADO não mata ninguém!
avatar

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 16484
Pontos Ativos : 20865

http://www.shiftactif.com https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

Resolvido Re: Sistema de pré-visualizar em HTML

Mensagem por Hancki em 23/09/16, 03:30 pm

És ó adicionar mais este CSS:
Código:
.cuerpotp {
    overflow: hidden !important;
}

Hancki
avatar

Hancki
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8041
Pontos Ativos : 12015

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Sistema de pré-visualizar em HTML

Mensagem por IsmaelS. em 23/09/16, 10:57 pm

Resultou, só tem um pequeno problema veja se calha de ser um avatar grande:


É possível deixar por cima de tudo?

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2768
Pontos Ativos : 3863

http://master-publicitario.forumeiros.com/
  • 0

Resolvido Re: Sistema de pré-visualizar em HTML

Mensagem por Hancki em 24/09/16, 05:52 pm

Substitua o código todo da página por este:
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
avatar

Hancki
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8041
Pontos Ativos : 12015

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Sistema de pré-visualizar em HTML

Mensagem por IsmaelS. em 25/09/16, 12:03 pm

Ficou óptimo obrigado!! ;D

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2768
Pontos Ativos : 3863

http://master-publicitario.forumeiros.com/

Resolvido Re: Sistema de pré-visualizar em HTML

Mensagem por while em 25/09/16, 12:09 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

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3105
Pontos Ativos : 4499

http://www.ajuda.forumeiros.com https://www.facebook.com/https://www.facebook.com/profile.php?id=100012157981279

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