Question

请查看网站x上的粘性消息。当您单击关闭按钮时，页面将转到顶部，并且向下滚动时将显示粘滞消息。任何想法如何解决这个问题？我已在functions.php和必需的javascript / CSS中添加了以下脚本。

// Enqueue Scripts and Styles.
add_action( 'wp_enqueue_scripts', 'oc_enqueue_scripts_styles' );
function oc_enqueue_scripts_styles() {

    wp_enqueue_script( 'oc_sticky_message', get_bloginfo( 'stylesheet_directory' ) . '/js/sticky-message.js', array( 'jquery' ), '1.0.0' );
}

//* Register widget areas
genesis_register_sidebar( array(
    'id'          => 'sticky-message',
    'name'        => __( 'Sticky Message', 'oc' ),
    'description' => __( 'This is the sticky message section.', 'oc' ),
) );

// Add markup for the sticky message.
add_action( 'genesis_before', 'oc_sticky_message' );
function oc_sticky_message() {

    genesis_widget_area( 'sticky-message', array(
        'before' => '<div class="sticky-message">',
        'after'  => '<a class="dismiss dashicons dashicons-no-alt" href="#"><span class="screen-reader-text">Dismiss</span></a></div></div>',
    ) );
}

jQuery(function($) {
    // Add reveal class to sticky message after 100px
    $(document).on("scroll", function() {
        if ($(document).scrollTop() > 100) { // Revealed after a person has scrolled 100px down
            $(".sticky-message").addClass("reveal");
        } else {
            $(".sticky-message").removeClass("reveal");
        }
    });
    $('.sticky-message a.dismiss').click(function(e){
        e.preventDefault();
        $(this).parents(".sticky-message").addClass("hard-close");
    });
});

.hard-close {
      display:none !important;
}

Answer 1

将以下script行和CSS添加到您的代码中。我假设close标签具有dismiss类作为静态类。

CSS

.hard-close{
  display:none !important;
}

脚本

$('.sticky-message a.dismiss').click(function(e){
  e.preventDefault();
  $(this).parents(".sticky-message").addClass("hard-close");
});

无法关闭“创世纪”主题中的粘性消息

1 个答案: