2

自从我第一次发布这个问题以来,我已经决定采用一种方法,但要么是完全错误,要么实施不当。

ISSUE 我有几个页面包含 div 内容并使用 jQuery Masonry 进行布局。这些页面通过锚页面具有交叉引用链接。例如,页面 A 上的第五个内容 div 链接到页面 B 上第九个 div 上的锚点。

问题是在 Masonry 完成之前锚位置不正确存在 - 即在 Masonry 关闭时锚可以正常工作,但是当 Masonry 运行时链接最终会转到页面顶部。

尝试的解决方案我假设我需要停止寻找锚的动作,直到砌体完成,但我无法弄清楚如何在砌体完成后实现我假定的调用滚动函数的方法。

我什至接近我尝试编码的方式:

 /* Masonry */
jQuery(document).ready(function() {
var $container = $('#items');
$container.imagesLoaded(function(){
    $container.masonry({
        itemSelector : '.item',
        columnWidth : 470,
        isAnimated: true
    });
});

//Call Scroll function after Masonry complete
 msnry.on( 'layoutComplete', function( msnryInstance, laidOutItems ) {

    if (window.location.hash) {// Scroll function
        setTimeout(function() {
            $('html, body').scrollTop(0).show();
            $('html, body').animate({
                scrollTop: $(window.location.hash).offset().top -20 
                }, 1000)
        }, 100);
    };//End scroll function


  }); // End Masonry complete function

});

虽然有一个平滑滚动解决方案会很好。如果能进入页面的正确部分,我将不胜感激。

PS - 我也知道从 Masonry jQuery masonry 如何调用 layoutComplete获得准确或一致的响应可能存在问题

4

0 回答 0