teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

3

const を letに

2020/09/17 07:12

投稿

takahashi-one
takahashi-one

スコア120

title CHANGED
File without changes
body CHANGED
@@ -12,7 +12,7 @@
12
12
  <div class="z" style="top:50;left:50;width:100;height:100;background-color:red"></div>
13
13
  <script>
14
14
  let deg=0;
15
- const id=setInterval(draw, 10);
15
+ let id=setInterval(draw, 10);
16
16
  function draw() {
17
17
  d3.select(".z").style("transform","rotate("+(deg++)+"deg)")
18
18
  if(deg>360)clearInterval(id);

2

補足を追加する

2020/09/17 07:11

投稿

takahashi-one
takahashi-one

スコア120

title CHANGED
File without changes
body CHANGED
@@ -20,4 +20,19 @@
20
20
  </script>
21
21
  </body>
22
22
  </html>
23
- ```
23
+ ```
24
+
25
+ 回答ありがとうございます。window.onload を試したのですが解消されませんでした。
26
+ chromeで試していたのですが、試しにfirefoxとedgeとie11で試したら正常に回転しました。
27
+ chromeだけの現象と言うことになりました。
28
+
29
+ ブラウザのロード時ではなく、下記のようにkeypressで実行させるとchromeでも正常に回転しました。
30
+ ```javascript
31
+ d3.select("body").on("keypress", function() {
32
+ if(d3.event.keyCode==32){//spaceキー
33
+ deg=0;
34
+ id=setInterval(draw, 10);
35
+ }
36
+ })
37
+ ```
38
+ 何か思いつくことありますか?

1

変更した

2020/09/17 05:40

投稿

takahashi-one
takahashi-one

スコア120

title CHANGED
File without changes
body CHANGED
@@ -12,7 +12,7 @@
12
12
  <div class="z" style="top:50;left:50;width:100;height:100;background-color:red"></div>
13
13
  <script>
14
14
  let deg=0;
15
- let id=setInterval(draw, 10);
15
+ const id=setInterval(draw, 10);
16
16
  function draw() {
17
17
  d3.select(".z").style("transform","rotate("+(deg++)+"deg)")
18
18
  if(deg>360)clearInterval(id);