3

这是我正在处理的网站:http: //kognitek.nazwa.pl/stockize/mak/MMprodukcja/parallaxProject/stromaTestowa/test.html

该站点在使用Opera上的箭头键向下滚动时闪烁。这是我用于滚动的代码:

//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/起初,脚本似乎很好,但是当你到达底部并尝试再次上升时,屏幕开始闪烁

编辑2:

我认为它可以防止默认问题,解决这个问题

编辑X:

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

4

1 回答 1

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/stromaTestowa/test_all.html

它可以向下/向上滚动,并且可以正常工作!

将对其进行优化并在几天内使其成为一个片段:)

于 2012-05-23T19:17:17.287 回答