Проблема бесконечного прокручивания при прокрутке: элемент загружается, но при этом зависание не работает - PullRequest
0 голосов
/ 12 марта 2020

Я сделал тамбур с Темпоном (Десандро), используя бесконечный свиток. Бесконечная прокрутка работает, но на новых элементах (загруженных после прокрутки) эффект наведения не работает! Не могли бы вы мне помочь?

на странице: [https://octavdesign.tumblr.com/tagged/restaurants]

Код html:

<article data-tags="all restaurants" data-postid="611645184704462848" class="post ft-section has-caption photo">

При наведении:

<article data-tags="all restaurants" data-postid="611645184704462848" class="post ft-section has-caption photo hover">

После прокрутки и загрузки всех сообщений класс "hover" не добавляется при загрузке сообщений

JS (из темы. js)

function() { var e = t(".post"); !1 === m && (e.on("click", function() { t(this).toggleClass("hover") }), e.hover(function() { t(this).addClass("hover") }, function() { t(this).removeClass("hover") })) }(),

JS (на странице html)

<script type="text/javascript">

        $(document).ready(function(){
            /*Masonry init */
            var container = document.querySelector('#posts');

            var msnry = new Masonry( container, {
                itemSelector: '.post',
                columnWidth: '.post' ,
                percentPosition: true
            });

            var imgLoad = new imagesLoaded( container, {
                itemSelector: '.post',

            }
            );

            var infScroll = new InfiniteScroll( container, {
            navSelector  : '#pagination',    // selector for the paged navigation 
            nextSelector : '#pagination a',  // selector for the NEXT link (to page 2)
            itemSelector : '.post',     // selector for all items you'll retrieve
              loading: {
                  finishedMsg: 'No more pages to load.',
                  img: 'http://i.imgur.com/6RMhx.gif'
              },
             path: '#pagination a', // hack
             append: '.post',
             outlayer: msnry ,
             status: '.loading-status',
             scrollThreshold: 700,
             loadOnScroll:true, // disable loading
             history: false,
            },

            function( newElements ) {
            // hide new items while they are loading
            var $newElems = $( newElements ).css({ opacity: 0 });
            // ensure that images load before adding to masonry layout
            $newElems.imagesLoaded(function(){
              // show elems now they're ready
              $newElems.animate({ opacity: 1 });
              $container.masonry( 'appended', $newElems, true ); 
            });

      });



            setTimeout(function(){
                msnry.layout();
            }, 3000);
            setInterval(function(){
                msnry.layout();
            }, 1000);

        });
    </script>

Спасибо!

...