JQuery - раскладка кладка выдает - Отличная библиотека

Первый раз с помощью JQuery и им пытаются получить основной стиль каменной кладки на работу, у меня есть следующий код в моем HTML ...JQuery - раскладка кладка выдает

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 

<head> 

<title>_Box</title> 

<link href="styles.css" rel="stylesheet" type="text/css"> 

<body> 

<script src="jquery.js"></script> 
<script src="masonry.js"></script> 
<script> 
$(window).ready(function() { 
    $("#container").masonry({ 
      itemSelector: '.item', 
      columnWidth: 240, 
      isAnimated: !Modernizr.csstransitions 
     }); 
}); 
</script> 

<div id="container"> 

<div class="item"><img src="images/eventbox.png"></img></div> 
<div class="item"><img src="images/forumbox.png"></img></div> 
<div class="item"><img src="images/weekbox.png"></img></div> 
<div class="item"><img src="images/weekbox.png"></img></div> 
<div class="item"><img src="images/weekbox.png"></img></div> 
<div class="item"><img src="images/weekbox.png"></img></div> 
<div class="item"><img src="images/top10box.png"></img></div> 
<div class="item"><img src="images/eventbox.png"></img></div> 

</div> 

</body> 
</head>

и следующее в моем CSS файл ...

html { 
    height:100%; 
} 

body { 
    width:950px; 
    height:100%; 
    margin:0 auto; 
    margin-top:100px; 
    background-image: url(images/gridbg.png); 
} 

.item{ 
    float: left; 
    padding: 5px; 
    margin: 5px; 
}

любая помощь будет большим, как ив значительной степени следовал учебник пока его не работает

это то, что он выглядит как

http://i47.tinypic.com/2jfdr7n.jpg

Если это помогает, изображения различной ширины и высоты.

Вопрос: Как я могу получить макет для того, что должна делать каменная кладка, что прекрасно вписывается друг в друга; примеры на кладке.

источник

2013-03-29 box

Вы должны положить конец элементу перед телом. Помимо этого ваш код выглядит хорошо для меня. Вы проверили вкладку сети и консоль? Возможно, есть ошибка или вы получаете 404 на вашем masonry.js –

Сеть в порядке, консоль сказала, что в каменной кладке есть синтаксическая ошибка - у объекта нет метода «масонства», считают, что этот раздел $ («# container») .masonry ({--- какие-нибудь идеи? – box

вы сделали то, что предложил Xeano и исправить ваш недействительный HTML? – Codasaurus

В примере масонства jQuery у него есть дополнительные CSS, определенные для оберток.

Вы пробовали разные определения CSS? Он может искать свойства высоты и ширины, чтобы получить измерения объектов на странице.

Я также хотел бы предложить проверить вашу реализацию с документом готовы и не окно, как то, что у вас есть: $(window).ready(function() { >>>$(document).ready(function() {

проверить источник с сайта масонства. Это определенно отличается от того, что у вас здесь, а затем использовать firebug или что-то похожее на отладку.

var $items = $(items.join('')); 
    $items.imagesLoaded(function(){ 
     $container 
     .masonry('remove', $loadingItem).masonry() 
     .append($items).masonry('appended', $items, true); 
    });

источник

2013-03-29 22:57:44 Ligemer

JQuery - раскладка кладка выдает

ответ

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