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

来源:https://www.sucaihuo.com/js/4246.html 2019-03-13 11:36浏览(1270) 收藏

jQuery+bootstrap响应式二级下拉导航菜单代码是一款非常简单实用的企业网站导航下拉菜单展开收缩特效,电脑端和移动端效果都不错。
jQuery+bootstrap响应式二级下拉导航菜单代码
分类:导航菜单 > 下拉导航 难易:初级
查看演示 下载资源 下载积分: 30 积分

js代码

<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
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2