Geek asks and answers

Screen flickers in opera while scrolling with .animate.scrollTop ()

Here is the site on which it works: http://kognitek.nazwa.pl/stockize/mak/MMprodukcja/parallaxProject/stronaTestowa/test.html

The object flashes, and it scrolls with the arrow keys in the opera. Here is the code I use to scroll:

//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;
                    }
                }
            }
        });
    });

}

I have already spent some time trying to fix this and still cannot find the reason for this behavior. The site works fine in Chrome, Firefox, IE8, IE9. The problem only occurs in Opera. I know I got this piece of x3 code at the end of my index.html, I am going to optimize it as soon as I find a solution.

Any idea what's wrong here?

Edit:

: http://jsfiddle.net/mymlyn/Mr5vR/ script , ,

Edit2:

, , atm

EditX:

, , -... : http://cssdeck.com/labs/swayiqbq/2 .browser, jquery 1.9.

+3
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

/, , !

:)

+1

More articles:


All Articles