Html 错误消息显示错误

我在提交表单时尝试显示HTML5错误消息时遇到问题，如所示：

顶部的深灰色栏是我的导航栏

问题是我的表单有点长，所以你必须向下滚动确认。但是，如果没有填写包含必需标记的字段，页面将自动向上滑动以显示错误消息。问题是错误消息覆盖了我的导航栏，导航栏中有一个字段用于填写所需信息

我想让我的页面再滚动一点，这样导航栏和错误消息都可以看到

我也使用引导

代码来自下面的注释：

var animate = true;
$( "input,select,textarea" ).bind( "invalid", function() {
    console.log('Invalid');
    var offset = $(this).offset();
    offset.top -= 200;
    if (animate) {
        animate = false;
        $('html, body').animate({ scrollTop: offset.top }, 10, function() {
            animate = true;
        });
    }
}); 

---

提前感谢您，

尝试向容器元素添加边距，这会将内容向下推到导航栏

 style="margin-top :100px;"

---

可以分享一些代码吗？var animate=true$（“输入，选择，文本区域”）.bind（“无效”，function（）{console.log（'invalid'）；var offset=$（this.offset（）；offset.top-=200；if（animate）{animate=false；$（'html，body'）.animate（{scrollTop:offset.top}，10，function（）{animate=true；}）；}）；