2015-11-22 7 views
0

Как говорится в названии, я реализую масонство в определенной части моего сайта Wordpress.Масонство не работает (но отлично работает на www.jsfiddle.net)

Вы можете проверить его here и найти изображение ниже:

enter image description here

В изображении выше, это место, где я пытаюсь осуществить кладку.

Коды для кладки в здесь:

Fiddle

$(window).load(function(){ 
 
\t $('.tentofifteen').masonry({ 
 
\t // options 
 
\t itemSelector: '.grid-item', 
 
\t columnWidth: 1, 
 
\t }); 
 
});
.grid-item { 
 
    float: left; 
 
} 
 

 
.grid-superloop-ten {width:319px; min-height:700px;background:#CCC;} 
 
.grid-superloop-eleven {width:220px; min-height:350px; background:#009;} 
 
.grid-superloop-twelve {width:437px; min-height:350px; background:#F36;} 
 
.grid-superloop-thirteen {width:337px; min-height:350px; background:#CC9;} 
 
.grid-superloop-fourteen {width:319px; min-height:350px; background:#0F0;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/masonry/3.3.2/masonry.pkgd.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/masonry/3.3.2/masonry.pkgd.min.js"></script> 
 
<div class="tentofifteen"> 
 
    <section class="grid-superloop-ten grid-item" id="wired-superloop"> 
 
    </section> 
 

 
    <section class="grid-superloop-eleven grid-item" id="wired-superloop"> 
 
    </section> 
 

 
    <section class="grid-superloop-twelve grid-item" id="wired-superloop"> 
 
    </section> 
 

 
    <section class="grid-superloop-thirteen grid-item" id="wired-superloop"> 
 
    </section> 
 

 
    <section class="grid-superloop-fourteen grid-item" id="wired-superloop"> 
 
    </section> 
 
</div>

Он работает не так ли?

Проблема в том, что при запуске КОПИРОВАНИЯ одних и тех же точных кодов от jsfiddle к Dreamweaver ничего не происходит. Что не так? Я что-то упускаю?

ответ

0

В вашем опубликованном коде вы загружаете кирпичную кладку дважды. На вашем сайте вы загружаете кирпичную кладку перед jQuery, но вызываете ее с помощью функции jQuery, поэтому вам нужно загрузить свои скрипты, подобные этому, а не так, как они есть сейчас.

<script src="https://code.jquery.com/jquery-2.1.3.js" type="text/javascript" language="javascript"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/masonry/3.3.2/masonry.pkgd.min.js" type="text/javascript"></script> 

BTW, вы загружаете 2 версии jQuery, 1.11.3 и 2.1.3. Вам нужно загрузить только один.

Смежные вопросы