0

我正在尝试滚动到特定 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);
}
4

2 回答 2

2

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

于 2012-01-11T14:22:13.120 回答
1

我相信我看到了你的问题。尝试用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不知道该项目的位置。

编辑以响应代码示例的评论：

看起来您看到的错误不是您在上面发布的showBox功能。问题是由于调用函数后类中的元素showMe被隐藏造成的。scrollTo尝试在用户单击元素后立即隐藏showMe元素，而不是将它们淡出。

于 2011-12-28T12:07:31.643 回答