简单实用的jQuery响应式网站导航菜单代码免费下载

简单实用的jQuery响应式网站导航菜单代码,自适应浏览器宽度的导航栏布局,电脑和手机端效果都不错。

JS代码

<script type="text/javascript" src="js/jquery.min.js"></script> 
<script type="text/javascript"> 
//用于判断导航栏的状态 
var toggle = true; 
 
//导航栏按钮 
$('.btnImg').click(function() { 
    if (toggle) { 
        $('.btnImg').css("border", "1px solid #b0ccf3"); 
        toggle = false 
    } else { 
        $('.btnImg').css("border", "1px solid transparent"); 
        toggle = true; 
    } 
    $(".show").slideToggle(300); 
}) 
 
//窗口大小发生改变 
$(window).resize(function() { 
    //获取窗口宽度 
    var windSize = $(window).width(); 
 
    if (windSize > 576) { 
        $(".show").slideDown(0); 
    } else { 
        $(".show").slideUp(0); 
    } 
}); 
</script>
打赏
0

评论0

请先

没有账号? 忘记密码?

社交账号快速登录