Как еще можно реализовать автоматическую прокрутку текста на сайте?

CSS, HTML, PHP
1 комментарий

Я использую на сайте автоматическую прокрутку текста по вертикали с помощью JS. Опубликовал проект. В браузере отображается анимация хорошо, но на экране анимация не работает. Как можно еще реализовать анимацию?

&lt;script&gt;     let scrollStep = 1;     let direction = 1;     const box = document.querySelector('#FIO');     const content = document.querySelector('#FIO');      function goUpAndGoBack() {          var u = document.querySelector('#viv').getBoundingClientRect().top;         let time = 30;         box.scrollBy(0, scrollStep * direction);         setTimeout(() =&gt; goUpAndGoBack(), time);          if (document.querySelector('#viv').getBoundingClientRect().top == u) {             direction = -1 * direction;         }     }     goUpAndGoBack();  &lt;/script&gt;

1

Дополнительно:

мне любопытно, как в смотрите в браузер без экрана?

modelair, в мониторе на моноблоке в браузере смотрю и там отображается движение, а в коридоре на стене большая панель и на ней не отображается

$kyD@rk, ну да. мне с вас по слову вытягивать? или вы полагаете, что тут должны все догадаться, что за экран у вас, какой браузер используется при этом. there're no magicians here

Данный контент воспроизводится на Медиаплеере LG WP400. В сms нет браузера ну или какой-то возможности настройки браузера. Можно только выводить информацию в блоках

А при чём тут .NET?

$kyD@rk, ваш встроенный и, вероятно, устаревший браузер в webOS умеет не всё. ищите по этому слову информацию

+ Заказать

Для решения данной проблемы вы можете воспользоваться услугами фрилансеров. Мы выполним необходимую работу быстро и качественно.

Есть ответ
08.04.2024

Ответить

Для реализации автоматической прокрутки текста на сайте можно использовать JavaScript. Вот пример кода, который позволит вам добавить эту функциональность на вашем сайте:

window.onload = function() {
  var scrollSpeed = 2; // Скорость прокрутки (чем меньше значение, тем быстрее)
  var scrollDirection = 'up'; // Направление прокрутки ('up' - вверх, 'down' - вниз)

  function scrollText() {
    var scrollContainer = document.getElementById('scroll-container');
    var scrollContent = document.getElementById('scroll-content');

    if (scrollDirection === 'up') {
      if (scrollContainer.scrollTop >= scrollContent.offsetHeight) {
        scrollContainer.scrollTop = 0;
      } else {
        scrollContainer.scrollTop += scrollSpeed;
      }
    } else {
      if (scrollContainer.scrollTop <= 0) {
        scrollContainer.scrollTop = scrollContent.offsetHeight;
      } else {
        scrollContainer.scrollTop -= scrollSpeed;
      }
    }
  }

  setInterval(scrollText, 50); // Интервал прокрутки (чем меньше значение, тем плавнее)
};

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

window.onload = function() {

var scrollSpeed = 2; // Скорость прокрутки (чем меньше значение, тем быстрее)

var scrollDirection = 'up'; // Направление прокрутки ('up' - вверх, 'down' - вниз)

function scrollText() {

var scrollContainer = document.getElementById('scroll-container');

var scrollContent = document.getElementById('scroll-content');

if (scrollDirection === 'up') {

if (scrollContainer.scrollTop >= scrollContent.offsetHeight) {

scrollContainer.scrollTop = 0;

} else {

scrollContainer.scrollTop += scrollSpeed;

}

} else {

if (scrollContainer.scrollTop <= 0) {

scrollContainer.scrollTop = scrollContent.offsetHeight;

} else {

scrollContainer.scrollTop -= scrollSpeed;

}

setInterval(scrollText, 50); // Интервал прокрутки (чем меньше значение, тем плавнее)

};

Этот код создает автоматическую прокрутку содержимого элемента с идентификатором "scroll-content" внутри контейнера с идентификатором "scroll-container". Вы можете настроить скорость и направление прокрутки, а также интервал обновления.

Не забудьте добавить HTML-элементы на вашу страницу, например:

<div id="scroll-container" style="height: 100px;overflow: hidden">
  <div id="scroll-content">
    <!-- Ваш текст здесь -->
  </div>
</div>

1

2

3

4

5

</div>

Этот код поможет вам реализовать автоматическую прокрутку текста на вашем сайте без необходимости использовать сторонние библиотеки или плагины.

Как еще можно реализовать автоматическую прокрутку текста на сайте?

Дополнительно:

Оставить комментарий Отменить

Ответы

Ежедневно, круглосуточно

Как еще можно реализовать автоматическую прокрутку текста на сайте?

Дополнительно:

Оставить комментарий Отменить

Ответы

Метки

Ежедневно, круглосуточно