Добавление выделения с использованием javaScript - PullRequest
Новая
       29

Добавление выделения с использованием javaScript

0 голосов
/ 29 мая 2020 
How can I print the data in the array one by one into the scrolling text using javascript.
How can I print the data in the array one by one into the scrolling text using javascript.
How can I print the data in the array one by one into the scrolling text using javascript.
How can I print the data in the array one by one into the scrolling text using javascript.


var arrayList=[
	["Ambitioni dedisse scripsisse iudicaretur."],
	["Ambitioni dedisse scripsisse iudicaretur."],
	["Ambitioni dedisse scripsisse iudicaretur."],
	["Ambitioni dedisse scripsisse iudicaretur."],
	["Ambitioni dedisse scripsisse iudicaretur."],
	["Ambitioni dedisse scripsisse iudicaretur."],
	["Ambitioni dedisse scripsisse iudicaretur."]
];
  .quetoBody{
      width: 300px; 
      margin-left: 150px; 
      margin-top: 40px; 
      background-color: aqua; 
      padding: 15px;
  }
  @keyframes slydeAnimation {
    0%   { text-indent: 430px }
    100% { text-indent: -485px }
  }

  @-webkit-keyframes slydeAnimation {
    0%   { text-indent: 430px }
    100% { text-indent: -485px }
  }

  .slyde {
    overflow: hidden;
    white-space: nowrap;
    animation: slydeAnimation 17s linear infinite;
    -webkit-animation: slydeAnimation 17s linear infinite;
  }

  .slyde:hover {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
  }
<html>
<head></head>
<body>
 <div class="quetoBody">
   <p id="queto" class="slyde">
    Ambitioni dedisse scripsisse iudicaretur.
  </p>
 </div>
</body>
</html>
How can I print the data in the array one by one into the scrolling text using javascript.
How can I print the data in the array one by one into the scrolling text using javascript.
How can I print the data in the array one by one into the scrolling text using javascript.
How can I print the data in the array one by one into the scrolling text using javascript.

1 Ответ

0 голосов
/ 29 мая 2020

Просто измените время по своему усмотрению, и вы можете go

function run() {
    setInterval(() => {
        document.querySelector("p").textContent = arrayList[count];
        if (count + 1 == arrayList.length) {
            count = 0;
        } else {
            count++;
        }
    }, 5000);
}

var count = 0;

var arrayList = [
   ["Ambitioni dedisse scripsisse iudicaretur. 1"],
   ["Ambitioni dedisse scripsisse iudicaretur. 2"],
   ["Ambitioni dedisse scripsisse iudicaretur. 3"],
   ["Ambitioni dedisse scripsisse iudicaretur. 4"],
   ["Ambitioni dedisse scripsisse iudicaretur. 5"],
   ["Ambitioni dedisse scripsisse iudicaretur. 6"],
   ["Ambitioni dedisse scripsisse iudicaretur. 7"]
];
  .quetoBody{
      width: 300px; 
      margin-left: 150px; 
      margin-top: 40px; 
      background-color: aqua; 
      padding: 15px;
  }
  @keyframes slydeAnimation {
    0%   { text-indent: 430px }
    100% { text-indent: -485px }
  }

  @-webkit-keyframes slydeAnimation {
    0%   { text-indent: 430px }
    100% { text-indent: -485px }
  }

  .slyde {
    overflow: hidden;
    white-space: nowrap;
    animation: slydeAnimation 5s linear infinite;
    -webkit-animation: slydeAnimation 5s linear infinite;
  }

  .slyde:hover {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
  }
<html>
<head></head>
<body onload=run()>
 <div class="quetoBody">
   <p id="queto" class="slyde">
    
  </p>
 </div>
</body>
</html>
...