我想应用一个外部js文件,它将自动隐藏我的导航栏

时间:2015-02-20 18:24:23

标签: javascript html

我想在stackoverflow上将我在此处找到的js应用到我的导航栏。这是为了在一段时间不活动后自动隐藏它。但我不知道如何在我的导航栏中包含和应用代码。 这就是我的html                   

    <div class="basic-wrapper"> 

        <a class="btn responsive-menu pull-right" data-toggle="collapse" data-target=".navbar-collapse">
            <i class='icon-menu-1'></i>
        </a> 

        <a class="navbar-brand" href="<?php echo home_url(); ?>">
            <?php 
                if( get_option('custom_logo') ){
                    echo '<img src="'. get_option('custom_logo') .'" alt="" data-src="'. get_option('custom_logo') .'" data-ret="'. get_option('custom_logo_retina') .'" class="retina" />';
                } else {
                    echo bloginfo('title');
                    echo '<br /><small>';
                    echo bloginfo('description');
                    echo '</small>';
                }
            ?>
        </a> 

    </div>

    <div class="collapse navbar-collapse pull-right">

        <?php
            if ( has_nav_menu( 'primary' ) ){
                wp_nav_menu( 
                    array(
                        'theme_location'    => 'primary',
                        'depth'             => 3,
                        'container'         => false,
                        'container_class'   => false,
                        'menu_class'        => 'nav navbar-nav',
                        'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                        'menu_id'           => 'ebor-main-menu',
                        'walker'            => new ebor_bootstrap_navwalker()
                    )
                );

            } else {
                echo '<a href="'. admin_url('nav-menus.php') .'">Set up a navigation menu now</a>';
            }

            if( get_option("header_social_link_1") )
                get_template_part('loop/loop','socialheader');
        ?>

    </div>

  </div><!--/.container-->
</div><!--/.nav-collapse --> 

这是我找到的代码 -

$("div").hide();

$("html").mousemove(function( event ) {
$("div").show();

myStopFunction();
myFunction();
});

function myFunction() {
myVar = setTimeout(function(){
    $("div").hide();
}, 1000);
}
function myStopFunction() {
if(typeof myVar != 'undefined'){
    clearTimeout(myVar);
}
}

1 个答案:

答案 0 :(得分:0)

如果您准备如何包含外部JavaScript文件,则需要执行以下操作:

<script src="//path/to/external/js/file.js"></script>

至于实际的JS代码,我不认为这会给你你想要的东西,因为它会隐藏页面上的所有DIV。

你想要用类似的东西替换它。 $( “#DIV IDofMenuContatiner”)......