1

那里。

所以，我已经在使用Masonry jQuery 插件来制作图片库马赛克。好的，脚本工作“很好”，但是当我加载页面时，图像 CSS 对齐是错误的，或者不工作。看：

截屏

但是，如果我按 CTRL+SCROLL 或 CTRL++/CTRL+-，则脚本可以工作：

截屏

为什么？我该如何解决？

我的 JS：

    $(function(){
        var $container = $("#galeria");
            $container.masonry({
            itemSelector : 'li',
            columnWidth : 200
            });
    });

我的 CSS：

.organizar-galeria{ width: 100%; }
.organizar-galeria ul li{ width: 200px; }
.organizar-galeria ul li img{ float: left; width: 100%; }
#galeria{ width: 100%; float: left; padding: 5px 0px 10px 0px; }

我的 HTML：

       <div id="galeria">
        <div class="organizar-galeria">
        <?php if($GalleryDAO->countFetch['qntFotos'] == 0 AND $UserDAO->getUid() == $_SESSION['uid']) { ?>

        <p>Parece que você ainda não tem nenhuma foto. Se o dia estiver legal, que tal tirar uma?</p>
        </div>

    <?php } else { ?>

        <ul>
            <?php while($GalleryDAO->data = $GalleryDAO->query->fetch( PDO::FETCH_ASSOC )):
                $var = getimagesize($GalleryDAO->getImageThumb()); ?>
                <li>
                    <?php if( $UserDAO->getUid() == $_SESSION['uid'] ): ?>
                        <a id="<?php echo $GalleryDAO->getImageId(); ?>" class="remover" href="#" >X</a>
                    <?php endif; ?>
                    <a id="pictures"rel="group1" title="<?php echo $GalleryDAO->getLegenda(); ?>" href="<?php echo $GalleryDAO->getImageURL(); ?>" target="_blank">
                        <img class="excluirimg" <?=$var[3];?> src="<?php echo $GalleryDAO->getImageThumb(); ?>" alt="Imagem de <?php echo $UserDAO->getNome(); ?>" /></a>

                </li>
            <?php endwhile; ?>
        </ul>
    </div>

我已经尝试过window.load和document.ready。

谢谢。

4

1 回答 1

0

我不知道砌体，但也许你的功能执行得太早了。

您是否尝试过以下为图像加载而设计的方法：

$(function(){
    var $container = $('#galeria');
    $container.imagesLoaded(function(){
         $container.masonry({
              itemSelector : 'li',
              columnWidth : 200
         });
    });
});

祝你好运，
罗布森

于 2011-07-22T19:09:44.597 回答