twitter-bootstrap - 将焦点从固定页眉或固定页脚下移出

Question

有没有办法设置填充或边距，或调用 javascript 以将输入元素从固定导航栏下方移出并进入 View ？

我正在使用 bootstrap 3.1 并创建了一个 bootply 来展示我正在努力解决的问题。

问题是当用户使用“Tab”键逐步浏览输入元素并且输入元素落在固定顶部导航栏或固定底部导航栏之后。

将其隐藏在顶部导航栏下并不像底部导航栏那么糟糕，因为控制流从顶部开始。如果用户使用选项卡备份表单，则控制流会出现问题。

下面是 bootply 的 URL:http://bootply.com/110608#

谢谢

Answer 1

我也有同样的问题，但我不希望每个输入都有动画，这是基于 Skelly 回答的替代方案:

$('input').focus(function () {
    var element = $(this);
    if (element.offset().top - $(window).scrollTop() < 80)
    {
         $('html, body').animate({
            scrollTop: element.offset().top - 80 /* 80 is height of navbar + input label */
        }, 500);
    }
});