砌体jQuery插件不起作用 [英] Masonry jQuery Plugin Not Working

问题描述

我正在尝试将Masonry应用于这批代码:

I'm trying to apply Masonry to this batch of code:

<?php 
//If There Are No Posts In The DB
if(condition) : ?>
    <p> There Are Currently No Posts On This Site.</p> 
    <?php
    //If There Are Posts In The DB - Loop Through All The Posts
    else : ?>   
        <div id="masonry-grid">
        <div class="gutter-sizer">
    <?php foreach ($a as $b) :
        <div class="grid-item">
        <img src="source/of/the/image">
        </div>
    <?php endforeach; ?>
        </div>
        </div>
        <script>
        $(document).ready(function(){
var $container = jQuery('#masonry-grid');
$container.masonry({
columnWidth: 200,
itemSelector: '.grid-item'
});
});
    </script> 
<?php endif;?>

它并没有按照砌体的方式排列图像. 我已经按照按照此处的方式检查了我的课程和ID的匹配情况，并且我的jQuery + Masonry文件已正确加载(在单独的头文件中)按照此处.

It doesn't quite line up the images in the way masonry is suppose to. I've checked my classes and id's match as per here, and that my jQuery + Masonry files are loaded correctly (in a separate header file) as per here.

我正在考虑这是否是文档中代码放置的问题，但是更改它的位置似乎并不能完全解决问题.

I'm contemplating whether this is a question of code placement within the document, but changing it's location doesn't quite seem to solve the problem.

推荐答案

在脚本上方添加了包含内容-就像一个饰物一样.

Added the includes on top of the scirpt - and works like a charm.

<script src="<?=base_url();?>includes/js/jquery.min.js"></script>
<script src="<?=base_url();?>includes/js/masonry.pkgd.js"></script>   
<script>
--Scripty Script--
</script>

这篇关于砌体jQuery插件不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！