Question

我想点击此按钮，这是手风琴的一个部分头部，并将其移至页面顶部（基于窗口）

我觉得这很简单---但这是漫长的一天。有什么想法吗？

有些背景是这是一个类似手风琴的东西 - 按钮是标题。因为手风琴很长 - 而且手机屏幕很小 - 当你折叠和打开时...你可以最终进入一个部分的一些随机中间区域而我试图让那个部分移动到顶部而不是哈希...我已经尝试了一些哈希想法，但我还需要一个if语句来避免在大屏幕上发生这种情况。我希望这很清楚。谢谢。 OH和HERE is a fiddle

HTML

<div class="some-div"></div>

<div class="some-div"></div>

<button>button to endup up at top</button>

<div class="some-div"></div>
<div class="some-div"></div>

<div class="some-div"></div>

<div class="some-div"></div>

<div class="some-div"></div>
<div class="some-div"></div>

<div class="some-div"></div>

<button>button to endup up at top</button>

的javascript

$('button').on('click', function() {
    $(this). go-to-the-top-with-an-offset-of-10px();  
});

Answer 1

有了这个，您可以移动到页面顶部（＆＃34;基于窗口＆＃34;）：

$('button').click(function() {   // on button click
    $("html, body").animate({    // catch the `html, body`
        scrollTop:0              // make their `scrollTop` property 0, to go at the top
    }, 1000);                    // in 1000 ms (1 second)
});

DEMO

或者如果你想向上移动10px的偏移量，请使用：

$('button').click(function () { // on button click
    $("html, body").animate({ // catch the `html, body`
        scrollTop: $(this).offset().top - 10 // button's offset - 10 
    }, 1000); // in 1000 ms (1 second)
});

DEMO

或者让我们说你想点击第8个div到顶部，使用：

$('button').click(function () { // on button click
    $("html, body").animate({ // catch the `html, body`
        scrollTop: $("div:nth-of-type(8)").offset().top // 8th div's top offset
    }, 1000); // in 1000 ms (1 second)
});

单击时，将元素添加到窗口顶部（带偏移）

1 个答案:

DEMO

DEMO

DEMO