質問編集履歴

1

コードと質問文の変更

2019/08/09 12:38

投稿

katopa165
katopa165

スコア19

test CHANGED
@@ -1 +1 @@
1
- hoverのみテキストを一文字ずつ時間差でランダムに表示させる方法が分りません。
1
+ なぜ時間差で表示されないのでしょう
test CHANGED
@@ -1,14 +1,12 @@
1
- hover時のみopacity:0のテキストを時間差でランダムにopacity:1にしたのですが、
1
+ ランダムに時間差で表示されるよう実装てみたのですが、
2
2
 
3
- 現在はhover時にランダムで一文字のみか表示出来ず、randomメソッドも値が重複ししまうため何度hoverしなければ全ての文字が表示されません。
3
+ どうしても時間差で表示されません。
4
4
 
5
- またhoverしていないに文字を消たいのですが、その方法も分りません。
5
+ どうすれば間差で表示されるでょう
6
6
 
7
7
 
8
8
 
9
- どうすれば一度のhoverで全ての文字をランダムに時間差で表示し、hoverを外すタイミングで表示を無くせるのか教えて頂きたいです。
10
-
11
- うぞよろしくお願いいたします。
9
+ ご教授のほどよろしくお願いいたします。
12
10
 
13
11
 
14
12
 
@@ -64,17 +62,19 @@
64
62
 
65
63
  const span = document.querySelector('#str').children;
66
64
 
67
- const ran = Math.floor(Math.random()* span.length);
65
+ for(let i = 0;i<50;i++){
68
66
 
69
-
67
+ const ran = Math.floor(Math.random()* span.length);
70
68
 
71
- for(let i = 0;i<span.length;i++){
69
+ if(!span[ran].classList.contains('see')){
72
70
 
73
- if(!span[ran].classList.contains('see')){
71
+ setTimeout(() => {
74
72
 
75
- span[ran].classList.add('see');
73
+ span[ran].classList.add('see');
76
74
 
75
+ },100);
76
+
77
- }
77
+ }
78
78
 
79
79
  }
80
80