hamburgler.js没有在移动设备上工作

时间:2015-07-31 18:08:25

标签: javascript jquery html css jquery-mobile

我正在尝试通过
使用hamburgler.js作为网站 http://codepen.io/Johnm__/pen/eNgXZW。一切都在桌面上运行良好,但当我在手机上查看时,我可以点击菜单,菜单会弹出。但是当我尝试点击链接时它不会做任何事情,或者如果我点击菜单它将不会退出。这是我的完整js与其他功能,但前两个是我遇到麻烦的菜单:

$(document).ready(function() {
function e() {
    $("body").on("touchstart", function(e) {
        $("body").hasClass("noscroll") && e.preventDefault()
    })
}
$(document).foundation(), e(), $(".icon").click(function() {
    $(".mobilenav").fadeToggle(500), $(".top-menu").toggleClass("top-animate"), $("body").toggleClass("noscroll"), $(".mid-menu").toggleClass("mid-animate"), $(".bottom-menu").toggleClass("bottom-animate")
}), $(".mobilenav a").click(function() {
    $(".mobilenav").fadeOut(500), $(".top-menu").removeClass("top-animate"), $("body").removeClass("noscroll"), $(".mid-menu").removeClass("mid-animate"), $(".bottom-menu").removeClass("bottom-animate")
}), $(".viewport").mouseenter(function() {
    $(this).children("a").children("img").animate({
        height: "300",
        left: "0",
        top: "0",
        width: "500"
    }, 100), $(this).children("a").children("span").fadeIn(200)
}).mouseleave(function() {
    $(this).children("a").children("img").animate({
        height: "300",
        left: "0",
        top: "0",
        width: "500"
    }, 100), $(this).children("a").children("span").fadeOut(200)
}), $(".skillbar").each(function() {
    $(this).find(".skillbar-bar").animate({
        width: jQuery(this).attr("data-percent")
    }, 2e3)
}), $.fn.lbyl = function(e) {
    {
        var n = $.extend({
                content: "",
                speed: 10,
                type: "fade",
                fadeSpeed: 500,
                finished: function() {}
            }, e),
            t = $(this),
            i = [],
            o = n.content;
        $(this).length
    }
    t.empty(), t.attr("data-time", o.length * n.speed);
    for (var a = 0; a < o.length; a++) i.push(o[a]);
    $.each(i, function(e, i) {
        t.append('<span style="display: none;">' + i + "</span>"), setTimeout(function() {
            "show" == n.type ? t.find("span:eq(" + e + ")").show() : "fade" == n.type && t.find("span:eq(" + e + ")").fadeIn(n.fadeSpeed)
        }, e * n.speed)
    }), setTimeout(function() {
        n.finished()
    }, o.length * n.speed)
}, $(".example-1").lbyl({
    content: "..."
}), $(".example-2").lbyl({
    content: "..."
})

});

我怎样才能使它适用于移动设备和桌面设备?我不确定这需要哪种jquery方法。任何帮助指出我正确的方向将不胜感激。

1 个答案:

答案 0 :(得分:0)

在你的hamburgler.js中,它可能是附加到body标签的noscroll类...尝试摆脱类,看看它是否仍然坏了

if ($('body').hasClass('noscroll')) {

:P