代码素材

jQuery+bootstrap响应式二级下拉导航菜单代码

特效介绍

jQuery+bootstrap响应式二级下拉导航菜单代码是一款非常简单实用的企业网站导航下拉菜单展开收缩特效,电脑端和移动端效果都不错。

5fa4a661011eb.jpg

<script>$(function() {
    //超过一定高度导航添加类名 
    var nav = $("header"); //得到导航对象   
    var win = $(window); //得到窗口对象   
    var sc = $(document); //得到document文档对象。   
    win.scroll(function() {
      if (sc.scrollTop() >= 100) {
        nav.addClass("on");
      } else {
        nav.removeClass("on");
      }
    })
    //移动端展开nav 
    $('#navToggle').on('click',
    function() {
      $('.m_nav').addClass('open');
    })
    //关闭nav 
    $('.m_nav .top .closed').on('click',
    function() {
      $('.m_nav').removeClass('open');
    })
    //二级导航  移动端 
    $(".m_nav .ul li").click(function() {
      $(this).children("div.dropdown_menu").slideToggle('slow') $(this).siblings('li').children('.dropdown_menu').slideUp('slow');
    });
  })</script>
  • 0 次

本文链接:https://www.daimasucai.com//texiao-5.html

版权声明:本站所有内容均由互联网收集整理、网友上传,并且以计算机技术研究交流为目的,仅供大家参考、学习,不存在任何商业目的与商业用途。 若您需要商业运营或用于其他商业活动,请您购买正版授权并合法使用。 我们不承担任何技术及版权问题,且不对任何资源负法律责任。本站素材来源于网络,如有侵犯您的权益请及时告知,本站将及时处置。

联系客服
手机端
手机端
手机端
返回顶部