Get Beaver Builder links to align perfectly with top of full height rows

When you do a layout that has a series of full height rows with arrows to navigate between them (kind of like this) you may notice that it doesn’t go exactly to the top of the next row but just slightly above it. This is something they built in on purpose to account for fixed headers, evidently. So here is some JS to use in your layout (BB > Layout CSS & JS) which should fix this.

You can get this code right from the source at https://docs.wpbeaverbuilder.com/beaver-builder/advanced-builder-techniques/smooth-scrolling-tweaks-with-code/

 

jQuery( function($){
    var win = $( window );
    
    function bbScroll(){
        if ( 'undefined' != typeof FLBuilderLayoutConfig ) {    
            var offset = 0;
            
            if ( 'undefined' === typeof FLBuilderLayout ) {
                return;
            }
            
            if ( FLBuilderLayout._isMobile() && win.width() < 992 ) { offset = 0; } if ( $( 'body.admin-bar' ).length > 0 ) {
                offset += 32;
            }
            
            FLBuilderLayoutConfig.anchorLinkAnimations.duration = 1000;
            FLBuilderLayoutConfig.anchorLinkAnimations.easing = 'swing';
            FLBuilderLayoutConfig.anchorLinkAnimations.offset = offset;
        }
    }
    
    bbScroll();
    win.on( 'resize', bbScroll );
    
} );