ランダムに時間差で表示されるよう実装してみたのですが、
どうしても時間差で表示されません。
どうすれば時間差で表示されるでしょうか?
ご教授のほどよろしくお願いいたします。
HTML
1<div id="str"> 2<span>s</span> 3<span>p</span> 4<span>a</span> 5<span>n</span> 6</div>
CSS
1#str { 2 background-color: #222; 3 color: #fff; 4 5} 6.see { 7 opacity: 1; 8} 9span { 10 opacity: 0; 11 transition: 1s; 12}
js
1document.querySelector('#str').addEventListener('mouseover',()=>{ 2 const span = document.querySelector('#str').children; 3 for(let i = 0;i<50;i++){ 4 const ran = Math.floor(Math.random()* span.length); 5 if(!span[ran].classList.contains('see')){ 6 setTimeout(() => { 7 span[ran].classList.add('see'); 8 },100); 9 } 10 } 11});
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/08/09 13:01