Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.04.2015, 17:04
Интересующийся
Отправить личное сообщение для Drm1804 Посмотреть профиль Найти все сообщения от Drm1804
 
Регистрация: 12.03.2015
Сообщений: 18

Изменение скорости скрола страницы
Доброго времени суток. Имеется скрипт, который делает делает прокрутку страницы до якоря плавной.
function smoothlyScroll(){
    var linkNav = document.querySelectorAll('.b-head-nav-item');
    var speed = .5;
    for( i=0 ; i < linkNav.length; i++){
        linkNav[i].addEventListener('click', function(){
            var scrollTop = window.pageYOffset;
            var hash = this.href.replace(/[^#]*(.*)/, '$1');
            var elemToScroll = document.querySelector(hash).getBoundingClientRect().top;
            var start = null;

            requestAnimationFrame(step);
            function step(time){
                console.log(time);
                if (start === null){
                    start = time;
                }
                var progress = time - start;
                console.log(progress);

                var distance = (elemToScroll < 0
                    ? Math.max(scrollTop - progress/speed, scrollTop + elemToScroll)
                    : Math.min(scrollTop + progress/speed, scrollTop + elemToScroll) );

                window.scrollTo(0,distance);
                if(distance != scrollTop + elemToScroll){
                    requestAnimationFrame(step);
                } else {
                    location.hash = hash;
                }
            }
            return false;
        } ,false);


    }
}

проблема в том, что хотелось бы сделать скорость прокрутки разной. Т.е. сначала побыстрее, а ближе к концу чтобы скорость замедлялась
Ответить с цитированием
  #2 (permalink)  
Старый 13.04.2015, 20:49
Кандидат Javascript-наук
Отправить личное сообщение для Brutus Посмотреть профиль Найти все сообщения от Brutus
 
Регистрация: 24.11.2013
Сообщений: 127

Знакомься с анимацией https://learn.javascript.ru/js-animation

http://jsfiddle.net/xo0ywg88/2/ вот и пример

Последний раз редактировалось Brutus, 13.04.2015 в 20:57.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Изменение стила при загрузке страницы Nifler Events/DOM/Window 4 19.12.2014 18:02
Изменение фона при обновлении(рефреш) страницы Marker Events/DOM/Window 3 14.10.2013 12:40
Програмное изменение домена страницы. SeemaN_tm Общие вопросы Javascript 9 28.06.2013 21:26
Предотвратить изменение размеров страницы при добавлении элемента NeVirus Events/DOM/Window 1 15.03.2013 08:33
Изменение адреса страницы после аякса. Tchort AJAX и COMET 9 03.09.2011 00:20