Question

这是我正在努力的网站： http://kognitek.nazwa.pl/stockize/mak/MMprodukcja/parallaxProject/stronaTestowa/test.html

在歌剧中向下滚动箭头键时，网站会闪烁。这是我用于滚动的代码：

//bottom of index.html
else if ($.browser.opera) {

    $(function() {
        $('html').on('keydown', function(event) {
            var keypressed = event.keyCode;
            var curScroll = $('html').scrollTop();
            var keys = scrollKeys.length;
            var moved = false;
            console.log("keypressed: " + keypressed);
            for (i = 0; i < keys; i++) {
                console.log("curScroll: " + curScroll)
                if (moved === false) {
                    if (keypressed === 40 && i != (keys - 1) && parseInt(scrollKeys[i]) <= curScroll && parseInt(scrollKeys[i + 1]) > curScroll) {
                        $('html').animate({
                            scrollTop : (parseInt(scrollKeys[i + 1]))
                        }, 'slow', function() {});
                        console.log('down');
                        moved = true;
                    } else if (keypressed === 38 && i != 0 && parseInt(scrollKeys[i]) >= curScroll && parseInt(scrollKeys[i - 1]) < curScroll) {
                        $('html').animate({
                            scrollTop : (parseInt(scrollKeys[i - 1]))
                        }, 'fast', function(){});
                        console.log('up');
                        moved = true;
                    }
                }
            }
        });
    });

}

我已经花了一些时间来解决这个问题，但仍然无法找到这种行为的原因。网站在Chrome，Firefox，IE8，IE9中运行良好。问题仅出现在Opera中。我知道我在index.html的末尾得到了代码x3的这一部分，我会在找到解决方案后立即对其进行优化。

这里有什么想法吗？

编辑：

我创造了这个小提琴：http://jsfiddle.net/mymlyn/Mr5vR/起初，脚本看起来很好，但是当你到达底部并尝试再次上升时，屏幕开始闪烁

EDIT2：

我认为它会阻止默认问题，解决这个问题

EditX：

我希望我没有失败编辑这个文件所以它没有成为社区维基...无论如何我升级了代码，它在这里可用： http://cssdeck.com/labs/swayiqbq/2 它使用.browser，它将从jquery 1.9中删除。

Answer 1

添加了一些代码来防止opera中的默认行为：

    $(document).keydown(function(e){
    var code = e.keyCode ? e.keyCode : e.which;
    if(code === 40 || code === 38){
        e.preventDefault();
        e.stopPropagation();
        return false;
    }
});

效果可以在这里看到： http://kognitek.nazwa.pl/stockize/mak/MMprodukcja/parallaxProject/stronaTestowa/test_all.html

可以向下/向上滚动，它可以正常工作！

要优化这一点，并在几天内将其作为一个片段：）

使用.animate .scrollTop（）滚动时在Opera中闪烁屏幕

编辑：

EDIT2：

EditX：

1 个答案: