Question

我是javascript的新手，使用了http://davidbcalhoun.com/2011/implementing-iphone-slider-unlock-with-input-type-range/

中的以下代码

我很难在Safari中使用它（它在Chrome中完美运行）。

下面给出了代码，如果这是非常明显但我愿意学习的话，我很抱歉：

(function(){
    var slider, sliderInput, sliderButton, sliderText, sliderTimeout, sliderOnchange, unlockCheck;
    slider = document.querySelector('.iphone-slider');
    sliderInput = slider.querySelector('input');
    sliderButton = sliderInput.querySelector('input::-webkit-slider-thumb');
    sliderText = slider.querySelector('span');
    unlockCheck = function(){
        if(sliderInput.value == 100) {
            sliderText.innerHTML = 'unlocked';
            sliderInput.value = 0;
            sliderText.style.opacity = 1;
        } else {
            setTimeout(function(){
                sliderInput.value = 0;
                sliderText.style.opacity = 1;
            }, 1000);
        }
    };

    sliderOnchange = function() {
        sliderText.style.opacity = ((100 - sliderInput.value) / 200);
        clearTimeout(sliderTimeout);
        sliderTimeout = setTimeout(unlockCheck, 300);
    };

    slider.onchange = sliderOnchange;
})();

Answer 1

这是桌面Safari和移动设备，它是css3和JavaScript中的解锁滑块模拟器...有关详细信息，请参阅链接： http://davidbcalhoun.com/2011/implementing-iphone-slider-unlock-with-input-type-range/

Javascript中的iPhone滑块 - 在Safari中出现问题

1 个答案: