Codigo destas imagens de modo menu

Item: Codigo destas imagens de modo menu
Rating: 1

por EDU2010 20.04.17 0:15

Detalhes da questão

Endereço do fórum: https://www.criadoresdepassaros.com/
Versão do fórum: phpBB3

Descrição

Qual código usa este site neste local de exemplo na imagem o sute é esse
http://www.scbiotec.com.br/

Segue imagem de exemplo

Codigo destas imagens de modo menu Sem_ty10

Codigo destas imagens de modo menu Sem_ty10

Este menu com imagem com links ,

por EDU2010 21.04.17 12:56

por EDU2010 22.04.17 14:48

por MateusV. 23.04.17 23:32

Adicione este código HTML onde deseja colocar o menu:

<div class="mtvmenu">
<a href="link">
<div class="mtv" style="background-image:url(url_da_imagem);"></div></a>
<a href="link">
<div class="mtv" style="background-image:url(url_da_imagem);"></div></a>
<a href="link">
<div class="mtv" style="background-image:url(url_da_imagem);"></div></a>
<a href="link">
<div class="mtv" style="background-image:url(url_da_imagem);"></div></a>
</div>

Azul -> O link do qual irá redirecionar
Vermelho -> Imagem que irá aparecer

Feito isto, adicione este código no seu CSS:

Código:: .mtv:hover { border: solid 5px #5caaff; width: 290px; height: 390px; -webkit-transition: 0.2s; -moz-transition: 0.2s; -o-transition: 0.2s; opacity: 0.9; } .mtv { width: 300px; /* border-radius: 10px; */ height: 400px; margin: 10px; display: inline-block; }

por EDU2010 25.04.17 18:42

Ok , qual o tamanho da imagem que devo usar e se eu quiser colocar um Titulo abaixo da imagem ..
Testei e é isso mesmo ...

por Luiz 25.04.17 19:43

Provavelmente, uma imagem quadrada irá ajudar.
Às dimensões, igual à do fórum que o senhor citou.

o/

por EDU2010 26.04.17 1:03

Tem como eu colocar um titulo pra cada imagem ?

por Luiz 26.04.17 1:10

Basta o senhor editar a imagem, e colocar um título nela, ou alterar o código para:

Código:: <div class="mtvmenu"> <a href="link"> <h4>TÍTULO</h4> <div class="mtv" style="background-image:url(url_da_imagem);"></div></a> <a href="link"> <h4>TÍTULO</h4> <div class="mtv" style="background-image:url(url_da_imagem);"></div></a> <a href="link"> <h4>TÍTULO</h4> <div class="mtv" style="background-image:url(url_da_imagem);"></div></a> <a href="link"> <h4>TÍTULO</h4> <div class="mtv" style="background-image:url(url_da_imagem);"></div></a> </div>

o/

por Luiz 30.04.17 15:17

Questão abandonada pelo autor, mas considerada resolvida por ter solução para o problema.
Tópico marcado como Resolvido e movido para Questões resolvidas.

Codigo destas imagens de modo menu