<!-- navigation fixed en scroll --> 
     
<div class="wrapper-menu menu-top navbar classique"> 
  <div class="navbar-brand"> 
    <a class="navbar-item" href="<?php echo home_url(); ?>" title="<?php bloginfo(); ?>"> 
      <img src="<?php echo get_template_directory_uri(); ?>/css/img/logo.svg" width="70px" alt="logo"> 
      <p class="is-size-5"><?php bloginfo('name');?></p> 
    </a> 
    <a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false" data-target="menu"> 
      <span aria-hidden="true"></span> 
      <span aria-hidden="true"></span> 
      <span aria-hidden="true"></span> 
    </a> 
  </div> 
<div id="menu" class="navbar-menu"> 
  <div class="navbar-start"> 
    <?php wp_nav_menu(array( 
      'theme-location' => 'header-menu', //change it according to your register_nav_menus() function 
      'depth' => 2, 
      'container' => 'navbar-end', 
      'items_wrap' => '%3$s', 
      'walker' => new Bulma_Walker(), 
    )); 
    ?> 
  </div> 
  <div class="navbar-end"> 
    <div class="navbar-item"> 
      <div class="field is-grouped"> 
        <form role="search" method="get" class="control is-expanded has-icons-left search-form" action="<?php echo home_url( '/' ); ?>"> 
          <input type="search" class="input" placeholder="" value="" name="s" title="Rechercher :" /> 
          <span class="icon is-small is-left"> 
            <i class="fas fa-search"></i> 
          </span> 
        </form> 
      </div> 
    </div> 
  </div> 
</div> 
</div>   
 
<!-- JQUERY & JQUERY PLUGIN--> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script src="https://flexure.fr/wp-content/themes/Flexure2020/js/jquery-scrolltofixed.js"></script> 
<script> 
/** * scroll to fixed 	*/ 
$('.wrapper-menu.menu-bottom').scrollToFixed(); 
// media query event handler 
if (matchMedia) { 
var mq = window.matchMedia("(min-width: 960px)"); 
mq.addListener(WidthChange); 
WidthChange(mq); 
} 
// media query change 
function WidthChange(mq) { 
if (mq.matches) { 
// Dock the header to the top of the window when scrolled past the banner. 
// This is the default behavior. 
$('.wrapper-menu.menu-top').scrollToFixed(); 
$(window).scroll(function() { 
var logo = $('.wrapper-menu .logo img'), 
targetScroll = $('.wrapper-content').position().top, 
currentScroll = $('html').scrollTop() || $('body').scrollTop(); 
if(currentScroll > targetScroll){ 
logo.css({ 
"width" : "60%", 
"opacity" : "1", 
"transition" : "0.4s ease-in-out", 
"margin-top" : "10px" 
}); 
}else{ 
logo.css({ 
"width" : "100%", 
"opacity" : "1", 
"transition" : "0.4s ease-in-out" 
}); 
} 
}); 
} else{ 
$('.wrapper-menu').css({"position":"relative"}) 
} 
} 
</script>