Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как сделать плавную прокрутку текста? Чтобы небыло попиксельных скачков (https://javascript.ru/forum/misc/36899-kak-sdelat-plavnuyu-prokrutku-teksta-chtoby-nebylo-popikselnykh-skachkov.html)

ant.kritsky 31.03.2013 09:59

Как сделать плавную прокрутку текста? Чтобы небыло попиксельных скачков
 
Нужно плавно прокручивать текст. Все примеры которые удалось найти реализуют это через попикселное изменение параметров стиля(типа scrollTop для body).

При медленной скорости прокрутки при такой реализации пропадает плавность, и движение происходит скачками.

Посоветуйте технологию при помощи которой это можно реализовать? Может какие-либо продвинутые либы для анимации или может это можно сделать при помощи canvas-а?

Предпологаю что это можно реализовать через флеш, но хотелось бы обойтись средствами javascript, html и css...

Опан 31.03.2013 11:01

Так пробовали?
<marquee direction=up scrollamount=1 scrolldelay=50>текст</marquee>

На канвасе тоже можно. По этой ссылке есть пример:
Анимация на Canvase

dmitriymar 31.03.2013 11:11

Цитата:

Сообщение от ant.kritsky
Нужно плавно прокручивать текст. Все примеры которые удалось найти реализуют это через попикселное изменение параметров стиля(типа scrollTop для body).

Дак может стоит двигать то, что не будет вызывать "перерисовку" всей информации в браузере? что нибудь выпадающее из потока , как все делают , див с абсолютом?

Цитата:

Сообщение от ant.kritsky
Посоветуйте технологию при помощи которой это можно реализовать? Может какие-либо продвинутые либы для анимации или может это можно сделать при помощи canvas-а?

Предпологаю что это можно реализовать через флеш......

а микроскопом гвозди забивать не пробовали?

ant.kritsky 31.03.2013 15:42

Цитата:

Сообщение от Опан
<marquee direction=up scrollamount=1 scrolldelay=50>текст</marquee>

попробовал по вашей наводке, но он тоже двигает не плавно(на медленноей скорости очень неудобно читать).

Цитата:

Сообщение от dmitriymar
Дак может стоит двигать то, что не будет вызывать "перерисовку" всей информации в браузере? что нибудь выпадающее из потока , как все делают , див с абсолютом?

Так же попробовал двигать див с position: absolute;, но эфект тот же - на маленькой скорости нет плавности, явно видно что тект скачет попиксельно

Aetae 31.03.2013 16:55

Ну какбэ экран состоит из пикселей. =\
Полупиксель можно получить разве что размытием на 2 пикселя - но это выглядит ещё противнее.
Энивей - для чтения без напряга авто-сколл противопоказан. Имхо, если уж делать его, то "scroolbyline", т.е. чтобы верхняя строка текста пропадала целиком.

zOdmin 31.03.2013 17:40

Лично я, например, не люблю плавную прокрутку.
На ПК отключаю ее в настройках ОС. На планшете\смартфоне сложнее, но там это еще важнее, т.к. сажает батарейку быстрее.
А если это будет сделано яваскриптом... наверняка сразу закрою этот сайт (это только это не что-то незаменимое).

danik.js 31.03.2013 20:41

zOdmin, да ну, че ты все в кучу сваливаешь.
Плавная прокрутка - это одно. Это клево, потому что позволяет отследить эту самую прокрутку взглядом и не потеряться. А тут я хз че автор хочет сделать. Видите ли он не доволен что в мониторе мало пикселей. Какую помощь он тут хочет получить - хз..

megaupload 31.03.2013 21:47

чтобы не было рывков делай как минимум 25 пикселей в секунду либо все таки придется решать на канве.

Aetae 31.03.2013 21:53

Цитата:

Сообщение от megaupload (Сообщение 243609)
чтобы не было рывков делай как минимум 25 пикселей в секунду либо все таки придется решать на канве.

Ну можно и поизвращаться:
1. Подложить прозрачный дубликат блока с текстом под него.
2. Сдвинуть дубликат вверх на 1 пиксель.
3. Плавно убирать прозрачность с дубликата и наращивать её у оригинала.
4. Сдвинуть прозрачный оригинал на 2 пикселя.
5. ...
6. Profit!

=)

zOdmin 01.04.2013 02:34

danik.js,
Так я ж не говорю за всех, а только за себя.
И лично для меня плавная прокрутка - это потеря ровно столько времени, сколько она занимает. 100мс, 200мс, 300мс - не важно.

Можно конечно еще сказать про загрузку проца. Конечно, это копейки, но если проц загружен на 100%, и у браузера по умолчанию обычный приоритет, то прокрутка может даже подлагивать. Или если оперативка кончилась и начался жуткий своп. Но это и правда редкость. А у кого не редкость - можно смело говорить: "купи нормальный комп", и продолжать делать необязательные скрипты.

Повторюсь: это просто мое мнение, не более.


Часовой пояс GMT +3, время: 01:00.