jQuery显示随窗口宽度而变化

时间:2016-08-31 02:52:10

标签: javascript jquery html css jquery-ui

我最近买了一个网站,但我在编辑它时遇到了麻烦,以使其符合我的需求。我想要实现的是,当窗口大小小于800像素时,使侧导航栏切换以隐藏导航列表。我敢肯定,对于你们中的许多人来说,这一定是一项非常容易完成的任务,但我在玩这些代码方面还很新。我希望你能抽出时间来帮助它。

提前致谢,

这是需要编辑的jQuery代码。

$(document).ready(function() {
"use strict";
$("nav ul li a").each(function() {
    if ($(this).next().length > 0) {
        $(this).addClass("parent");
    }
});

$(".toggleMenu").click(function(e) {
    e.preventDefault();
    $(this).toggleClass("active");
    $("nav ul").slideToggle(200);
});
    $(".toggleMenu").css("display", "inline-block");
    if (!$(".toggleMenu").hasClass("active")) {
        $("nav ul").show();
    } else {
        $("nav ul").hide();
    }
    $("nav ul li").unbind('mouseenter mouseleave');
    $("nav ul li a.parent").unbind('click').bind('click', function(e) {
        // must be attached to anchor element to prevent bubbling
        e.preventDefault();
        $(this).parent("li").toggleClass("hover");
    });
});

if ($(window).width() < 800) {
    $("nav ul li a").click(function() {
    "use strict";
    $("nav ul").slideToggle(200);
});    
}   

0 个答案:

没有答案