Question

我正在使用重力形式来创建三步形式。单击下一个按钮后，表单将加载新页面，然后自动向下滚动到表单。很好，但是我有一个约100像素的标头，因此它滚动了一些表格。

我的问题是：是否可以将偏移量添加到gform_confirmation_anchor中，以便对我的粘性标头进行偏移。

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

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

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

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

任何帮助将不胜感激。

Answer 1

一种解决方法是将top padding（CSS）添加到具有附加锚点的form标签，以创建偏移量。顶部填充：例如50px，如果多余的空间困扰您，则可以使用margin-top将其删除：-50px;偏移仍然有效。

Answer 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 ); 

            
        });
    
                
    });

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

重力形成多步锚点偏移

2 个答案: