Question

当我的菜单叠加层在触摸设备上显示（在iphone和ipad上进行了测试）时，所有内容都会显示，例如链接等，但背景颜色并未从透明更改。

一切在我的桌面上都能正常工作，而其他一切似乎只是触摸而已。我的代码中存在错误，导致无法在移动设备上正常工作？

$(document).ready(function () {

    $(".menu-btn a").on('click touch', function () {
        var scroll = $(window).scrollTop();
        $(".overlay").fadeToggle(200);
        $(this).toggleClass('btn-open').toggleClass('btn-close');

        if( $(this).hasClass('btn-close') ) {
            $(".navbar").css("background-color", "transparent");
        }
        else if( scroll > 100) {
            $(".navbar").css("background-color", "#CEB400");
        }
    });

    // $('.overlay').on('click', function () {
    //    $(".overlay").fadeToggle(200);
    //    $(".menu-btn a").toggleClass('btn-open').toggleClass('btn-close');
    // });

    $('.menu a').on('click touch', function () {
        $(".overlay").fadeToggle(200);
        $(".menu-btn a").toggleClass('btn-open').toggleClass('btn-close');
    });

});

$(document).ready(function() {
    $(window).scroll(function() {
        var scroll = $(window).scrollTop();
        if (scroll > 100) {
            if($('.overlay:visible').length == 0) {
                $(".navbar").css("background-color", "#CEB400");
            }
        } else {
            $(".navbar").css("background-color", "transparent");
        }
    });
});

Answer 1

我不认为jQuery（或jQuery mobile）具有“触摸”事件。您可能正在寻找tap。

点击/触摸事件的背景颜色更改在触摸设备上不起作用

1 个答案: