The navigation arrows are not clickable

  • Resolved CarolLeung

    (@carolleung)


    7 years, 9 months ago

    I am using the PHP shortcode in header.php to display my slider on home page only, but the navigation arrows are not clickable on my website. I don’t think my multilingual has anything to do with it since it is a separate PHP code.

    https://www.centralcrowdfund.com

    <?php
    if(WPGlobus::Config()->language == ‘en’ && is_front_page()) {
    echo do_shortcode(‘[smartslider3 slider=4]’);
    echo do_shortcode(‘[logoshowcase cat_id=”29″ show_title=”true” slides_column=”4″]’);
    echo do_shortcode(‘[project_grid columns=”3″ short_desc=”1″]’);
    }
    else if(WPGlobus::Config()->language == ‘zh’ && is_front_page()) {
    echo do_shortcode(‘[smartslider3 slider=5]’);
    echo do_shortcode(‘[logoshowcase cat_id=”29″ show_title=”true”]’);
    }
    else if(WPGlobus::Config()->language == ‘tw’ && is_front_page()) {
    echo do_shortcode(‘[smartslider3 slider=7]’);
    echo do_shortcode(‘[logoshowcase cat_id=”29″ show_title=”true”]’);
    }
    ?>

Viewing 5 replies - 1 through 5 (of 5 total)
  • Ramona

    (@nextend_ramona)

    Hi @carolleung

    Your problem is coming from the custom code you (or someone else who has admin access to your site) added to this file: https://centralcrowdfund.com/?sccss=1&ver=4.7.5

    .n2-ss-align {
    position: relative;
    z-index: -1 !IMPORTANT; 
    margin-top: 7px;
}

    which puts the slider behind its container, and prevents its element from being clicked, because you are not clicking on the slider, but on it’s higher container.

    You should remove the custom code (or at least the z-index setting) and that will allow you to click on the arrows.

    Thread Starter CarolLeung

    (@carolleung)

    Dear Ramona,

    Actually, if I remove the z-index, the slider will become on top of my dropdowns. Is there another solution where i can put the slider behind my dropdown menus?

    Thread Starter CarolLeung

    (@carolleung)

    I just removed the z-index: -1, but not my sliders are above me dropdown menus and I cannot access my dropdown pages from the front page.

    https://www.centralcrowdfund.com

    Ramona

    (@nextend_ramona)

    That happens because your menu doesn’t have any z-index set, and by default when two elements are on the same z-index, HTML usually puts the one with JavaScript codes on it a bit above the other. You should set the z-index of your menu and that will solve the problem.
    E.g:

    nav.menu-top-container {
    z-index: 999;
    position: relative;
}
    Thread Starter CarolLeung

    (@carolleung)

    Thank you! That worked, I will keep that in mind next time!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘The navigation arrows are not clickable’ is closed to new replies.