Como fazer esse feito usando imagem e não botão

lkm · Abril 25, 2012

preciso fazer esse efeito usando uma imagem ao invés do botão

<style>
.slide {position:relative;}
.slide .inner {
position:absolute;
left:0;
bottom:0;
color: #66cc66;}
.slide {
position:relative;
overflow:hidden;
height:120px;
width:350px;
margin:1em 0;
background-color:#ffc;
border:1px solid #999;
}
.slide .inner {
position:absolute;
left:0;
bottom:0;
width:338px;
height:36px;
padding:6px;
background-color:#4c5;
color:#333;
}
.slide button {margin:.7em 0 0 .7em;}
#slidebottom .inner {display:none;}
</style>
<script type="text/javascript" src="jquery-1.6.1.min.js"></script>
<script>
$(document).ready(function(){
$('#slidebottom button').hover(function(){ $(this).next().slideToggle(300); })
});
</script>
<body>
<div id="slidebottom" class="slide">
<button>gfdfgdfgdf</button>
<div class="inner">Executar efeito</div>
</div>

Churc · Abril 25, 2012

já tentou trocar onde está

<button>gfdfgdfgdf</button>

por

e

$(document).ready(
function()
{
$('#slidebottom button').hover(function(){ $(this).next().slideToggle(300); });
}
);

por

$(document).ready(
function()
{
$('#slidebottom img').hover(function(){ $(this).next().slideToggle(300); });
}
);

pela lógica era pra funcionar agora, talvez não... teste rsr

lkm · Abril 25, 2012

já tentei e também não rolou, está parecendo uma coisa simples mas já estou um tempão em cima disso.

agora funcionou, fiz o que você me passou e também troquei a biblioteca jquery para versão 1.7.2.

Obrigado

Entrar

Como fazer esse feito usando imagem e não botão

Pergunta

lkm

Link para o comentário

Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

Churc

Link para o comentário

Compartilhar em outros sites

lkm

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades