Prettyphoto posicionamento incorreto da imagem ao clicar
Olá amigos!
Estou com problemas de posicionamento da imagem ao clicar, no prettyphoto.
Ao clicar para abrir as fotos em tamanho grande, ele posiciona a imagem de modo que fica abaixo da tela, não conseguindo visualizar a mesma.
Link para ver o que acontece: http://www.internauticaguaruja.com.br/barcos/intermarine-440-full-6
Alguém consegue me ajudar?
Estou com problemas de posicionamento da imagem ao clicar, no prettyphoto.
Ao clicar para abrir as fotos em tamanho grande, ele posiciona a imagem de modo que fica abaixo da tela, não conseguindo visualizar a mesma.
Link para ver o que acontece: http://www.internauticaguaruja.com.br/barcos/intermarine-440-full-6
<div class="offer_gallery"> <div class="gallery_images"> <div id="gallery_images"> <?php foreach ($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"> <?php foreach ($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>
Alguém consegue me ajudar?
Diogo Santos
Curtidas 0
Respostas
Ronaldo Lanhellas
01/02/2015
Tenta posicionar a sua div que encapsula a imagem com o "position:absolute, left:xx, top:xx".
ex:
Estes valores são apenas demonstrativos, testes os seus.
ex:
<div class="offer_gallery" style='position:absolute; left:10px; top:10px'>
Estes valores são apenas demonstrativos, testes os seus.
GOSTEI 0
Ronaldo Lanhellas
01/02/2015
Tenta posicionar a sua div que encapsula a imagem com o "position:absolute, left:xx, top:xx".
ex:
Estes valores são apenas demonstrativos, testes os seus.
ex:
<div class="offer_gallery" style='position:absolute; left:10px; top:10px'>
Estes valores são apenas demonstrativos, testes os seus.
GOSTEI 0
Diogo Santos
01/02/2015
Obrigado pela resposta Ronaldo!
Não deu certo, misturou o quadro de descrição com a imagem.
Tentei posicionar na div que trata do zoom
Mesmo assim não fez efeito. Tem outra sugestão?
Muito obrigado!
Não deu certo, misturou o quadro de descrição com a imagem.
Tentei posicionar na div que trata do zoom
<div class="gallery_image_item" style:'position:absolute; top:10px'> <?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>
Mesmo assim não fez efeito. Tem outra sugestão?
Muito obrigado!
GOSTEI 0