Всем привет, пытаюсь сделать отображение как на brainyquote.com, чтобы элементы подгружались через аджакс и при этом применялась masonry. пробовал расширения: kop\y2sp\ScrollPager nirvana\infinitescroll\InfiniteScrollPager в 1м получилось сделать подгрузку, но масонри не применяется во вром вообще всё глухо. Есть у кого нибудь подходящий кусок кода или с использованием расширений или без них?
Решил в итоге сделать без виджетов, но... не меняется страница при переходе на следующую, т.е. есть ссылка на 2 страницу и инфинит скролл мне каждый раз аппендит 2ую страницу: PHP: $this->registerJs('var $grid = $(\'.grid\').masonry({ itemSelector: \'none\', columnWidth: 300, gutter: 5, visibleStyle: { transform: \'translateY(0)\', opacity: 1 }, hiddenStyle: { transform: \'translateY(100px)\', opacity: 0 }, }); Код (Javascript): var msnry = $grid.data(\'masonry\'); $grid.imagesLoaded( function() { $grid.masonry( \'option\', { itemSelector: \'.grid-item\' }); var $items = $grid.find(\'.grid-item\'); $grid.masonry( \'appended\', $items ); }); $grid.infiniteScroll({ path: \'.next1\', append: \'.grid-item\', outlayer: msnry, hideNav: \'.pagination\', history: false, checkLastPage: true })'); PHP: <?php Pjax::begin(['options' => ['id' => 'ajax-grid', 'timeout' => 3000], 'enablePushState' => false, 'enableReplaceState' => false, 'timeout' => 10000]); echo ListView::widget([ 'dataProvider' => $dataProvider, 'layout' => '<div class="grid">{items}</div><div class="pagination">{pager}</div>', 'itemOptions' => ['class' => 'grid-item'], 'itemView' => '/quotes/_single_item_view', 'options' => ['class' => 'qwe', 'id' => 'qwe' ], 'pager' => [ 'linkOptions' => [ 'class' => 'next1', ], 'disableCurrentPageButton' => true, 'maxButtonCount' => 0, //'nextPageCssClass' => 'next', //'$disabledPageCssClass' => true, ] ]); Pjax::end();