Question

我正在尝试滚动到特定div容器的顶部。目前我的代码是将页面内容滚动到视图中。有人知道怎么回事？ :)这是代码：

var openItem;

var showBox = function(item) {
    item.removeClass("loading");
    var infoBox = $("div.test", item);

    // Resize box
    item.width(853);
    item.height(infoBox.outerHeight());

    // Reload Masonry
    $('#container').isotope('reLayout');

    // Insert close button
    $('<a href="#" class="close">Close</a>"')
        .prependTo(".test .content")
        .click(function (e) {
            e.preventDefault();
            close(item);
        });

    // Insert close button
    $('<a href="#" class="close">Close</a>"')
        .appendTo(".test .content")
        .click(function (e) {
            e.preventDefault();
            close(item);
        });

    // Fade in test box
    setTimeout(function () {
        testBox.fadeIn();

        // Scroll box into view
        $(document).scrollTo(item, 1000);
    }, 280);
}

Answer 1

滚动到某个项目并不总是有效，因为Isotope使用CSS变换进行定位，而不是top/left。您可以使用transformsEnabled: false禁用转换。更好的是，如果您需要使用同位素获取项目的位置，请使用itemPositionDataEnabled。

Answer 2

我相信我看到了你的问题。请尝试使用以下代码替换setTimeout代码：

// Fade in test box
setTimeout(function() {
    testBox.fadeIn(function() {
        // Scroll box into view
        $(document).scrollTo(item, 1000);
    });
}, 280);

之前原始代码无效的原因是因为$(document).scrollTo(item, 1000)被调用时item尚未显示，因此scrollTo无法知道该项目的位置。< / p>

使用代码示例回复评论时编辑：

您上面发布的showBox函数看起来好像是而不是。问题是由调用showMe函数后隐藏类scrollTo的元素引起的。尝试在用户点击后隐藏showMe元素，而不是将其淡出。

滚动到不在视图中的特定div

2 个答案: