jQuery одушевленная помощь

Question

Я хочу медленно прокрутить элемент, чтобы создать эффект анимации прокрутки.У меня есть этот код:

См. здесь .

Прокрутите, чтобы увидеть.Я хочу, чтобы красная рамка медленно прокручивалась при прокрутке страницы.Но теперь необходимо прокрутить только вниз с + 50px, но когда вы прокручиваете вверх, красная коробка поднимается, но медленно ...

Спасибо ранее!

Answer 1

Смотрите мой пример скрипки здесь .Здесь важно убедиться, что вы используете setTimeout, чтобы избежать массовых событий наращивания, поскольку событие прокрутки окна вызывается много раз в зависимости от того, как пользователь прокручивает.

code

var scrollId;

$(document).scroll(scrollme);

function scrollme(){
    window.clearTimeout(scrollId);
    scrollId = window.setTimeout(scroll, 25);
}

function scroll(){
     $(".block").stop().animate({"top": ($(window).scrollTop()) + 30 + "px"}, 550);
}

Answer 2

Попробуйте следующий плагин Jquery,

http://www.smoothdivscroll.com/

Надеюсь, это поможет ...

Answer 3

Этот пример позволит div прокручивать страницу вверх, когда пользователь прокручивает вверх: http://jsfiddle.net/CJXEX/1/

$(document).scroll(function(event){
   var direction = scrollFunc(event);
    $(".block").animate({"top": "direction" + "=1px"}, "slow");
4});

//Source: /1042057/mozhno-li-ispolzovat-metod-window-onscroll-chtoby-vklychit-opredelenie-napravleniya-prokrutki
function scrollFunc(e) {
    if ( typeof scrollFunc.x == 'undefined' ) {
        scrollFunc.x=window.pageXOffset;
        scrollFunc.y=window.pageYOffset;
    }
    var diffX=scrollFunc.x-window.pageXOffset;
    var diffY=scrollFunc.y-window.pageYOffset;

    if( diffY<0 ) {
        return "-";
    } else if( diffY>0 ) {
        return "+";
    } else {
        return "-";
    }
    scrollFunc.x=window.pageXOffset;
    scrollFunc.y=window.pageYOffset;
}