Prettyphoto posicionamento incorreto da imagem ao clicar

01/02/2015

0

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

                    <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

Diogo Santos

Responder

Posts

02/02/2015

Ronaldo Lanhellas

Tenta posicionar a sua div que encapsula a imagem com o "position:absolute, left:xx, top:xx".

ex:

<div class="offer_gallery" style='position:absolute; left:10px; top:10px'>


Estes valores são apenas demonstrativos, testes os seus.
Responder

02/02/2015

Ronaldo Lanhellas

Tenta posicionar a sua div que encapsula a imagem com o "position:absolute, left:xx, top:xx".

ex:

<div class="offer_gallery" style='position:absolute; left:10px; top:10px'>


Estes valores são apenas demonstrativos, testes os seus.
Responder

03/02/2015

Diogo Santos

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

<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!
Responder

Assista grátis a nossa aula inaugural

Assitir aula

Saiba por que programar é uma questão de
sobrevivência e como aprender sem riscos

Assistir agora

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar