Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Ola pessoa , eu estou tentando fazer tipo uma galeria onde você clica e amplia as fotos , consegui fazer funciona perfeitamente no IE e no Firefox . No Crome quando você clica na imagem ela amplia mas da erro quando você clica nela para fechar , entao se alguem poder m ajudar .
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Livro jQuery do Maujor | Imagens e galerias de fotos</title>
<style type="text/css" media="all">width:500px;
font: 80%/1.2 Arial, Helvetica, sans-serif;
color:#666;
margin:30px auto;
padding:0;
}</style>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript">$(document).ready(function() {
$('.foto').each(function() {
$(this).click(function(event){
event.preventDefault();
$('.foto').hide();
if($(this).attr('width') > 100) {
$('.foto').show();
$(this).attr({width: 100, height: 75});
$('.abre-fecha').text('Clique para ampliar');
} else {
$(this).attr({width: 500, height: 375})
.slideDown(1500);
$('.abre-fecha').text('Clique para fechar');
}
});
});
});
// ]]>
</script>
</head>
<body>
<h1>Fotos de Brasília</h1>
<div id="galeria">
<a href="1.jpg"><img src="1.jpg" alt="Descrição da foto" width="100" height="75" class="foto" /></a>
<a href="2.jpg"><img src="2.jpg" alt="Descrição da foto" width="100" height="75" class="foto" /></a>
<a href="3.jpg"><img src="3.jpg" alt="Descrição da foto" width="100" height="75" class="foto" /></a>
<a href="4.jpg"><img src="4.jpg" alt="Descrição da foto" width="100" height="75" class="foto" /></a>
<a href="5.jpg"><img src="5.jpg" alt="Descrição da foto" width="100" height="75" class="foto" /></a>
<a href="6.jpg"><img src="6.jpg" alt="Descrição da foto" width="100" height="75" class="foto" /></a>
<a href="7.jpg"><img src="7.jpg" alt="Descrição da foto" width="100" height="75" class="foto" /></a>
<a href="8.jpg"><img src="8.jpg" alt="Descrição da foto" width="100" height="75" class="foto" /></a>
</div>
<span class="abre-fecha">Clique para ampliar</span>
</body>
</html>obrigado pessoal ..
Carregando comentários...