javascript - 滑动 jQuery 面板在 iPad 上不起作用

Question

我一直在玩 Wordpress 和 jQuery——这对我来说都是新的。我正在处理的博客在页面顶部有一个带有两个按钮的固定标题，每个按钮都使用 jQuery 在博客内容上向下滑动一个面板。

问题是在 iPad 上单击按钮时没有任何反应 - 除了出于某种原因，它会加载无限滚动。我听说 IOS 不喜欢 position:fixed 但我不明白这会对按钮/滑动内容产生什么影响。任何信息/提示都会收到。

*编辑:看起来 .click 在 iPad 上不起作用(？)，我需要以某种方式将它换成触摸事件。

CSS

> .about, .contact {
>     background: none repeat scroll 0 0 #000000;
>     display: none;
>     height: 500px;
>     position: fixed;
>     top: 90px;
>     width: 100%;
>     z-index: 100; }

jQuery

 $('.about_btn').click(function(e) {
    if($(this).hasClass('open')) {
        $('.about').slideToggle('slow');
        $('.about_btn').removeClass('open');
        return false;
    } else {
        $('.about').slideToggle('slow');
        $('.contact').hide();
        $('.about_btn').addClass('open');
        $('.contact_btn').removeClass('open');
    }
});

 $('.contact_btn').click(function(e) {
    if($(this).hasClass('open')) {
        $('.contact').slideToggle('slow');
        $('.contact_btn').removeClass('open');
        return false;
    } else {
        $('.contact').slideToggle('slow');
        $('.about').hide();
        $('.contact_btn').addClass('open');
        $('.about_btn').removeClass('open');
    }
});

$('.close').click(function(e) {
    e.preventDefault();
        $('.about').slideUp('slow');
        $('.contact').slideUp('slow');
        $('.about_btn').removeClass('open');
        $('.contact_btn').removeClass('open');
});

Answer 1

我在 iOS 上遇到过几次 jQuery 的“点击”事件问题。

对我有用的解决方案是将此 css 添加到可点击元素...

pointer: cursor;