重力形成多步锚偏移答案

【问题标题】：Gravity forms multi-step anchor offset重力形成多步锚偏移
【发布时间】：2019-05-12 00:05:52
【问题描述】：

我正在使用重力表单来创建一个三步表单。单击下一个按钮后，表单会加载新页面，然后自动向下滚动回表单。这很好，但是我有一个大约 100 像素的粘性标题，所以它滚动到表单之外有点太远了。

我的问题是：我可以在 gform_confirmation_anchor 中添加一个偏移量，以抵消我的粘性标题。

这是我在 Gravity Forms 文档中尝试过的代码： https://docs.gravityforms.com/gform_confirmation_anchor/

add_filter( 'gform_confirmation_anchor_5', function() {
    return 20;
} );

基本上这只允许您从顶部滚动到 20px（但是我无法正常工作）。

我需要的是将滚动偏移大约 100 像素。

任何帮助将不胜感激。

【问题讨论】：

运气好能找到答案吗？我遇到了同样的问题...
我没有找到这个问题的答案，而是我做了一个解决方法并使用 ajax 加载表单而不是导航到新页面。 [gravityform id=1 ajax=true] 我不确定这是否会对您有所帮助，具体取决于您的要求。

标签： php gravity-forms-plugin

【解决方案1】：

一种解决方法是将顶部填充 (CSS) 添加到带有锚点的表单标签以创建偏移量。 Padding-top: 50px 例如，如果多余的空间困扰你，你可以用 margin-top: -50px;偏移量仍然有效。

【讨论】：

【解决方案2】：

我遇到了同样的问题，正在寻找解决方案。我只用 Gravity Forms 5 对此进行了测试，但它可能适用于其他版本。

如果您有一个固定的标题，那么告诉窗口“尝试”定位到表单顶部的数学运算就太过分了。

add_filter( 'gform_confirmation_anchor', '__return_false', 100 );//hooked late to make sure we have the last say

然后，您需要添加此 JS（内联打印，或添加到与您的页面一起加载的 JS 文件中）：

    $(document).on( 'gform_post_render', function( event, formId, currentPage ){ 

        $(window).on( "load", function(){
           
            var headerHeight = $('.site-header').outerHeight(); //.site-header is my fixed header element. Replace with a class/id that corresponds to your site header
            
           $(this).scrollTop( $('#gform_wrapper_' + formId ).offset().top - headerHeight ); 

            
        });
    
                
    });

希望这对将来的其他人有所帮助！

【讨论】：