Colocando imagem em forma de quadrado nas notícias!

Olá galera, todos podem ver que no habbo brasil/portugual, é lançado um resultado de uma promoção de quartos, eles colocam a imagem dentro de um quadrado quando clica, ele se expande!

UAU, como será que eles fazem isso? Pois bem eu sei como, mais não vou contar! :silent:

Brincadeira, como vocês são amigos, eu conto sim! :cheers:

Primeiro, é necessário:

Ser admin de um hotel;
HTML ativado nas notícias;

Se estiver estes dois requirimentos, aqui vai o código:

Código:


<div class="article-images clearfix">
            <a href="URL_DA_IMAGEM" style="background-image: url(URL_DA_IMAGEM); background-position: -283px -334px"></a></div>


URL_DA_IMAGEM = Link da imagem hospedada.

Créditos:

snowk3 - 80% (Fazer o tutorial á mão e pegar o código)
habbo br/pt - 20% (Pelo código HTML)

Vlw ajudo muito tava querendo saber isso =) obg mesmo !

Como o tutorial não é completo, abaixo um outro código para colocar o quadrados um ao lado do outro. Só troque o "LINK" pelo link de sua imagem.

Código:

<div class="article-images clearfix">
            <a href="LINK" style="background-image: url(LINK); background-position: -340px -63px"></a>
                        <a href="LINK" style="background-image: url(LINK); background-position: -340px -63px"></a>
                        <a href="LINK" style="background-image: url(LINK); background-position: -340px -63px"></a>
                        <a href="LINK" style="background-image: url(LINK); background-position: -340px -63px"></a>
    </div>

Agora sim isso irá ajudar muitos hotéis, obrigado por disponibilizar a todos.

Tudo por um codigozinho em HTML, vendo ali é fácil. Valeu João.

Leon escreveu:Como o tutorial não é completo, abaixo um outro código para colocar o quadrados um ao lado do outro. Só troque o "LINK" pelo link de sua imagem.

Código:

<div class="article-images clearfix">
            <a href="LINK" style="background-image: url(LINK); background-position: -340px -63px"></a>
                        <a href="LINK" style="background-image: url(LINK); background-position: -340px -63px"></a>
                        <a href="LINK" style="background-image: url(LINK); background-position: -340px -63px"></a>
                        <a href="LINK" style="background-image: url(LINK); background-position: -340px -63px"></a>
    </div>   


Eu já sabia dessa aí amigão, é so puxar no HTML de uma página de notícias! :lol!:

Se sabia porque não colocou? Quando te perguntei você falou que não sabia.

Leon escreveu:Se sabia porque não colocou? Quando te perguntei você falou que não sabia.

É que eu havia esquecido o código HTML, pois anda muita coisa na minha cabeça, e ainda tinha 8muleques me chamando no MSN pra ajudar! :sleep:

Todos querem saber hehe

Mano nunca tinha visto esse tipo de Tutorial aqui, acho que ajudou muitas pessoas.

Snowk, parabéens .
isso deixa as noticias muito mais organizadas '-'

Snow ,isto é mt util pra quem quer ter um hotel organizado

Nossa, muito bom o tutorial! (:

abraços.

UAU, como será que eles fazem isso? Pois bem eu sei como, mais não vou contar!

Brincadeira, como vocês são amigos, eu conto sim! euripracomeça'


E terminando o tutorial é muito bom!

Ótimo Turial.

Me Ajudou Muito,funcionando aqui .