Реализация Jquery Isotope: без анимации

все шло хорошо, реализация изотопов по адресу:

http://rgbdrinks.squarespace.com/

Затем я забежал вперед, попытался изменить CSS контейнера и не смог повторить свои шаги.

Я был бы очень благодарен за любую помощь вообще.

С наилучшими пожеланиями,

Андрей

Вот код:

    <div id="container">
    <div class="item"><span class="full-image-inline ssNonEditable"><span><img style="width:   150px;" src="/picture/drink%20pour%203.jpg?pictureId=18133348&amp;asGalleryImage=true&amp;__SQUARESPACE_CACHEVERSION=1370962041640" alt="" /></span></span></div>
    <div class="item"><span class="full-image-inline ssNonEditable"><span><img style="width: 150px;" src="/picture/martini%20glass%20splash.jpg?pictureId=18133349&amp;asGalleryImage=true&amp;__SQUARESPACE_CACHEVERSION=1370962058097" alt="" /></span></span></div>
    <div class="item"><span class="full-image-inline ssNonEditable"><span><img style="width: 150px;" src="/picture/tablecloth.jpg?pictureId=18133350&amp;asGalleryImage=true&amp;__SQUARESPACE_CACHEVERSION=1370962092184" alt="" /></span></span></div>
<div class="item"><div id="squarespace-slideshow-wrapper-1370943850" rel="51b6f18ae4b0877f36bb6468" class="ss-slideshow-v2"></div></div>
</div>

<script src="http://rgbdrinks.squarespace.com/storage/isotope/js/jquery-1.7.1.min.js"></script>
<script src="http://rgbdrinks.squarespace.com/storage/isotope/js/jquery.isotope.min.js"></script>  
<script src="http://rgbdrinks.squarespace.com/storage/isotope/js/fake-element.js"></script>

<script>
$('#container').isotope({
  // options
  itemSelector : '.item',
  layoutMode : 'fitRows'
});
</script>

jquery-isotope
person Andrew    schedule 12.06.2013    source источник
comment
В чем проблема на самом деле?   -  person Stanley    schedule 12.06.2013
comment
Размер div не изменяется вместе с окном браузера, поэтому анимация элементов отсутствует.   -  person Andrew    schedule 12.06.2013
comment
ДА! Большое спасибо.   -  person Andrew    schedule 12.06.2013
comment
пожалуйста, нажмите на галочку, чтобы принять ответ ниже, если он решит вашу проблему. :)   -  person Stanley    schedule 12.06.2013
comment
О, на самом деле, у меня есть еще один вопрос в прямом эфире, не могли бы вы взглянуть на это тоже?   -  person Andrew    schedule 14.06.2013

Ответы (1)


arrow_upward
0
arrow_downward

Вы устанавливаете фиксированную ширину (1024 пикселя) для #canvasWrapper и #contentWrapper. Попробуйте установить ширину в процентах вместо фиксированной ширины

#canvasWrapper {
  width: 100%;
}

#contentWrapper{
  width: 100%;
}
person Stanley    schedule 12.06.2013