Ir ao conteúdo
  • Cadastre-se
Diogo Matos

Problema com zoom ao clicar em imagem

Recommended Posts

Boa noite amigos!

 

Para vocês, pode parecer um problema simples, mas estou batendo a cabeça.

 

Na página de detalhe dos barcos, ao clicar na foto para abrir o zoom, a foto fica fora de posicionamento, ficando não visível.

Vejam: http://www.internauticaguaruja.com.br/barcos/intermarine-440-full-6/

 

Sou iniciante e vi que o visualizador é o "prettyPhoto".

Gostaria de saber onde que posso resolver essa falha, se é no prettyPhoto.css ou no jquery.prettyPhoto.js.

 

 

 

Muito obrigado!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá, 

Não se tem haver, mas o prettyphoto usa o atributo rel, e não data-rel como está no código do seu site.

Esse prefixo "data-"  faz parte do html 5.

 

Repare na sintaxe:

<a href="images/fullscreen/img.jpg" rel="prettyPhoto" title="Descrição da imagem">      <img src="images/thumbnails/t_img.jpg" width="60" height="60" alt="Isto é o titulo da imagem" /></a>

Dentro do elemento <a>  com o link da imagem  grande e o atributo rel, você coloca  o elemento img da imagem pequena.

 

Seria interessante você postar aqui a parte do código que você coloca as imagens grandes e pequenas...

 

att, 

Dif

Compartilhar este post


Link para o post
Compartilhar em outros sites

Obrigado pela ajuda Dif!

 

Na verdade as imagens estão sendo carregadas no PrettyPhoto, só na exibição que está o problema. Olha o que acontece:

 

Antes

ANTES.jpg

 

Depois

DEPOIS.jpg

 

Quando abro a imagem vem top:5201, por isso não exibe, altero para 0 e a imagem aparece.

Como faço para alterar essa configuração que modifiquei? No css do PrettyPhoto está top: 0.

 

 

Obrigado!!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Sim, notei.. mas por isso mesmo que  você deveria postar aqui o fragmento da usabilidade do plugin, ou seja, a parte do javascript que chama o plugin.

Ali deve ter algum parâmetro que define a posição  do top.

 

Só pensar um poquinh, se você não definiu manualmente as posições no seu CSS, obviamente está sendo feito pelo plugin.. mas postar só os prints mostrando o lugar não resolve.

 

Para entender melhor o que estou dizendo veja este exemplo no JSFiddle: http://jsfiddle.net/Aslamise/gXkDu/

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá Dif!

 

Seria aqui?

<div class="offer_gallery"><div class="gallery_images"><div id="gallery_images"><?phpforeach ($images as $image_id => $image) {?><div class="gallery_image_item"><?php echo wp_get_attachment_image($image->ID, 'detail_barco'); ?><a href="<?php echo wp_get_attachment_url($image->ID); ?>" data-rel="prettyPhoto[gal]"><span><em class="ico_large"></em></span></a></div><?php}?></div></div><div class="gallery_thumbs"><div id="gallery_thumbs"><?phpforeach ($images as $image_id => $image) {?><a href="#"><?php echo wp_get_attachment_image($image->ID, 'thumb_detail'); ?></a><?php}?></div><a href="#" class="prev" id="gallery_thumbs_prev"></a><a href="#" class="next" id="gallery_thumbs_next"></a></div><script>jQuery(document).ready(function($) {function carGalleryInit() {$('#gallery_thumbs').children().each(function(i) {$(this).addClass('itm' + i);$(this).click(function() {$('#gallery_images').trigger('slideTo', [i, 0, true]);$('#gallery_thumbs a').removeClass('selected');$(this).addClass('selected');return false;});});$('#gallery_thumbs a.itm0').addClass('selected');$('#gallery_images').carouFredSel({infinite: false,circular: false,auto: false,width: '100%',scroll: {items: 1,fx: "crossfade"}});$('#gallery_thumbs').carouFredSel({prev: "#gallery_thumbs_prev",next: "#gallery_thumbs_next",infinite: false,circular: false,auto: false,width: '100%',scroll: {items: 1}});}$(window).load(function() {carGalleryInit();});var resizeTimer;$(window).resize(function() {clearTimeout(resizeTimer);resizeTimer = setTimeout(carGalleryInit, 100);});});</script> 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar agora





Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas publicações sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×