0

我正在使用带有fullpage.js的 ajax来获取图库图像并在其上应用同位素,在我单击打开图库的链接(转到目标部分)后,页面的滚动不会出现,我无法滚动,但是如果我重新调整浏览器的大小,则会出现滚动..

/* HTML */

<div class="section" id="textscroll">
    <div class="s" data-anchor="stext">
        <div class="container">
            <div class="ajax_content"></div>
        </div>
    </div>
</div>

/* JS */

$('#fullpage').fullpage({
        anchors: ['home', 'about', 'gallery'],
        keyboardScrolling: false,
        autoScrolling: true,
        loopHorizontal: false,
        scrollOverflow: true,
        controlArrows: false
});

$('.gallery-link').on('click','a',function(){

      var url = "directory/gallery_ajax.php";
      var postid = $(this).attr('data-post');

      $('.loading').addClass('active');

          $.ajax({
             type : 'post',
             url  : url,
             data : {
                    action : 'user_clicked',
                    postid : postid
             },
             success : function( response ) {

                $('.ajax_content').html('<div class="content" id="gallery-container"><div class="isotope">'+response+'</div></div>');
                var $container = $('.isotope').isotope({
                       itemSelector: '.item',
                       masonry: {
                         columnWidth: 160,
                         isFitWidth: true
                           }
                    });
                    $container.imagesLoaded( function() {
                         $('.loading').removeClass('active');
                         $.fn.fullpage.moveTo(3,0);
                         $container.isotope( 'layout' );
                    });
             },
             error: function( message ){
                     console.log(message);
             }
          });
            return false;
});
4

2 回答 2

0

在响应函数中调用 "$('.ajax_content').htm" 后,您需要再次初始化滚动插件,因为您更改了 dom 并且必须重新初始化插件以计算新的页面尺寸

于 2015-05-02T16:06:33.587 回答
-1

您可以使用:

$.fn.fullpage.reBuild();

文档链接

于 2015-09-07T07:07:18.440 回答