滑出菜单不适用于iPhone 3& 4

时间:2015-11-12 19:41:23

标签: javascript ios iphone

我有一个JavaScript文件,我认为这会导致某些移动设备出现问题。在iPhone 3& 4上,当您单击切换图标时,没有任何反应。我对JavaScript并不擅长,但这是我的代码。

$(document).ready(function() {

    // Off canvas menu
    var $slider = document.querySelector('#slider');
    var $toggle = document.querySelector('.toggle-nav');
    var $toggle2 = document.querySelector('nav .toggle-nav');
    // var $link = document.querySelector('.link > a');

    $toggle.addEventListener('click', function() {
        var isOpen = $slider.classList.contains('slide-in');

        $slider.setAttribute('class', isOpen ? 'slide-out' : 'slide-in');
        $('#slider').animate({'right': '100%'}, 400);
    });

    $toggle2.addEventListener('click', function() {
        var isOpen = $slider.classList.contains('slide-in');

        $slider.setAttribute('class', isOpen ? 'slide-out' : 'slide-in');
        $('#slider').animate({'right': '0'}, 300);
    });

    var toggleDataAttr = function(parentElem, toggleElem, opt1, opt2, dataAttr) {
        var toggleElem = parentElem.querySelector(toggleElem);
        toggleElem.setAttribute(dataAttr, toggleElem.getAttribute(dataAttr) === opt1 ? opt2 : opt1);
    };

    var toggle_li = document.querySelectorAll('li');

    for (var i = 0; i < toggle_li.length; i++) {
        toggle_li[i].onclick = function() {
            toggleDataAttr(this, '.toggleContent', 'closed', 'open', 'data-state');
            toggleDataAttr(this, '.toggleIcon', 'down', 'up', 'data-icon');
        };
    }

});

0 个答案:

没有答案