Question

我有一个主题的功能，占用了71％的成本（devtools profiler），因为该功能是在每个滚动事件中执行的，没有延迟或去抖动。然而，在我使用主题的行为中，该功能似乎毫无用处，所以我想通过覆盖它来删除它，但无法完成它。

main.js文件中的函数如下所示：

function fusionSideHeaderScroll() {
var $mediaQueryIpad = Modernizr.mq( 'only screen and (min-device-width: 768px) and (max-device-width: 1366px) and (orientation: portrait)' ) ||  Modernizr.mq( 'only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape)' ),
    $documentHeight,
    $windowPosition,
    $windowHeight,
    $bodyHeight,
    $adminbarHeight,
    $sideHeader,
    $sideHeaderWrapper,
    $sideHeaderHeight,
    $boxedWrapperOffset,
    $topOffset;

if ( ! $mediaQueryIpad ) {
    $documentHeight     = jQuery( document ).height();
    $windowPosition     = jQuery( window ).scrollTop();
    $windowHeight       = jQuery( window ).height();
    $bodyHeight         = jQuery( 'body' ).height();
    $adminbarHeight     = jQuery( '#wpadminbar' ).height();
    $sideHeader         = jQuery( '#side-header' );
    $sideHeaderWrapper  = jQuery( '.side-header-wrapper' );
    $sideHeaderHeight   = $sideHeaderWrapper.outerHeight();
    $boxedWrapperOffset = 0;

    if ( jQuery( 'body' ).hasClass( 'layout-boxed-mode' ) && jQuery( 'body' ).hasClass( 'side-header-right' ) ) {
        $sideHeader = jQuery( '.side-header-wrapper' );
        $boxedWrapperOffset = jQuery( '#boxed-wrapper' ).offset().top;
    }

    if ( Modernizr.mq( 'only screen and (max-width:' + avadaVars.side_header_break_point + 'px)' ) ) {

        if ( ! $sideHeader.hasClass( 'fusion-is-sticky' ) ) {
            $sideHeader.css({
                'bottom': '',
                'position': ''
            });
        }

        return;
    }

    if ( $sideHeaderHeight + $adminbarHeight > $windowHeight ) {
        $sideHeader.css( 'height', 'auto' );
        if ( $windowPosition > window.lastWindowPosition ) {
            if ( window.avadaTop ) {
                window.avadaTop = false;
                $topOffset = ( $sideHeaderWrapper.offset().top > 0 ) ? $sideHeaderWrapper.offset().top - $boxedWrapperOffset : $adminbarHeight;
                $sideHeader.attr( 'style', 'top: ' + $topOffset + 'px; height: auto;' );
            } else if ( ! window.avadaBottom && $windowPosition + $windowHeight > $sideHeaderHeight + $sideHeaderWrapper.offset().top && $sideHeaderHeight + $adminbarHeight < $bodyHeight ) {
                window.avadaBottom = true;
                $sideHeader.attr( 'style', 'position: fixed; bottom: 0; top: auto; height: auto;' );
            }
        } else if ( $windowPosition < window.lastWindowPosition ) {
            if ( window.avadaBottom ) {
                window.avadaBottom = false;
                $topOffset = ( $sideHeaderWrapper.offset().top > 0 ) ? $sideHeaderWrapper.offset().top - $boxedWrapperOffset : $adminbarHeight;
                $sideHeader.attr( 'style', 'top: ' + $topOffset + 'px; height: auto;' );
            } else if ( ! window.avadaTop && $windowPosition + $adminbarHeight < $sideHeaderWrapper.offset().top ) {
                window.avadaTop = true;
                $sideHeader.attr( 'style', 'position: fixed; height: auto;' );
            }
        } else {
            window.avadaTop = window.avadaBottom = false;

            $topOffset = ( $sideHeaderWrapper.offset().top > 0 ) ? $sideHeaderWrapper.offset().top - $boxedWrapperOffset : $adminbarHeight;

            if ( $windowHeight > window.lastWindowHeight && $bodyHeight > $sideHeaderWrapper.offset().top  + $boxedWrapperOffset + $sideHeaderHeight && $windowPosition + $windowHeight > $sideHeaderWrapper.offset().top + $sideHeaderHeight ) {
                $topOffset += $windowHeight - window.lastWindowHeight;
            }
            $sideHeader.attr( 'style', 'top:' + $topOffset + 'px; height: auto;' );
        }
    } else {
        window.avadaTop = true;
        $sideHeader.attr( 'style', 'position: fixed;' );
    }

    window.lastWindowPosition = $windowPosition;
    window.lastWindowHeight   = $windowHeight;
}
}

定义函数后，将其绑定到带

的滚动事件

// Make the side header scrolling happen
jQuery( window ).on( 'scroll', fusionSideHeaderScroll );
jQuery( window ).on( 'resize', fusionSideHeaderScroll );

我已经尝试写过我孩子主题的js文件

 function fusionSideHeaderScroll() {
     //do nothing
 }

在这种情况下，该函数仍然需要执行，这似乎是逻辑上的，因为它附加到每个滚动事件。有没有办法用javascript从滚动事件中分离函数？

Answer 1

尝试取消绑定滚动并使用.off()调整事件大小，如下所示：

jQuery( window ).off( 'scroll', fusionSideHeaderScroll );
jQuery( window ).off( 'resize', fusionSideHeaderScroll );

如何从父主题main.js文件中删除带有子主题js文件的javascript函数

1 个答案: