锚定到具有砌体布局的页面

时间:2014-05-28 10:03:52

标签: anchor masonry

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

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

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

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

我是否接近我试图编码的方式:

 /* 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

});

虽然有一个smoothscroll解决方案会很好。我只是谦虚地感激只是到达页面的右侧部分。

PS - 我也知道从砌体获得准确或一致的回复可能存在问题jQuery masonry how to call layoutComplete

0 个答案:

没有答案