質問編集履歴

6

css修正

2018/05/01 15:52

投稿

yuyan
yuyan

スコア7

test CHANGED
File without changes
test CHANGED
@@ -30,7 +30,7 @@
30
30
 
31
31
  ------ CSS -------
32
32
 
33
- .rect {
33
+ #rect {
34
34
 
35
35
  width: 100px;
36
36
 

5

css追加

2018/05/01 15:52

投稿

yuyan
yuyan

スコア7

test CHANGED
File without changes
test CHANGED
@@ -28,6 +28,30 @@
28
28
 
29
29
 
30
30
 
31
+ ------ CSS -------
32
+
33
+ .rect {
34
+
35
+ width: 100px;
36
+
37
+ height: 30px;
38
+
39
+ background: #00f;
40
+
41
+ color: #fff;
42
+
43
+ text-align: center;
44
+
45
+ margin: 0 20px;
46
+
47
+ }
48
+
49
+ ------ CSS -------
50
+
51
+
52
+
53
+ ------- JS -------
54
+
31
55
  var startTime = Date.now();
32
56
 
33
57
  var box = document.getElementById("rect");
@@ -50,6 +74,8 @@
50
74
 
51
75
  rect();
52
76
 
77
+ ------- JS -------
78
+
53
79
  ```
54
80
 
55
81
  どうぞよろしくお願いいたします。

4

コード修正

2018/05/01 15:52

投稿

yuyan
yuyan

スコア7

test CHANGED
File without changes
test CHANGED
@@ -20,9 +20,17 @@
20
20
 
21
21
  ```
22
22
 
23
+ ------ HTML ------
24
+
25
+ <div id="rect">box</div>
26
+
27
+ ------ HTML ------
28
+
29
+
30
+
23
31
  var startTime = Date.now();
24
32
 
25
- var box = document.getElementsByClassName("rect");
33
+ var box = document.getElementById("rect");
26
34
 
27
35
  var myTime = 500;
28
36
 
@@ -34,7 +42,7 @@
34
42
 
35
43
  var id = setTimeout(rect, 10);
36
44
 
37
- box[0].style.marginLeft = 20 + 20 * (current / myTime) + "px";
45
+ box.style.marginLeft = 20 + 20 * (current / myTime) + "px";
38
46
 
39
47
  }
40
48
 

3

コード修正

2018/05/01 15:39

投稿

yuyan
yuyan

スコア7

test CHANGED
File without changes
test CHANGED
@@ -34,8 +34,6 @@
34
34
 
35
35
  var id = setTimeout(rect, 10);
36
36
 
37
- console.log(current);
38
-
39
37
  box[0].style.marginLeft = 20 + 20 * (current / myTime) + "px";
40
38
 
41
39
  }

2

コード追加

2018/05/01 15:37

投稿

yuyan
yuyan

スコア7

test CHANGED
File without changes
test CHANGED
@@ -18,9 +18,7 @@
18
18
 
19
19
 
20
20
 
21
- -------------------------------------
21
+ ```
22
-
23
-
24
22
 
25
23
  var startTime = Date.now();
26
24
 
@@ -46,10 +44,6 @@
46
44
 
47
45
  rect();
48
46
 
49
-
50
-
51
- -------------------------------------
47
+ ```
52
-
53
-
54
48
 
55
49
  どうぞよろしくお願いいたします。

1

コードを追加しました。

2018/05/01 15:32

投稿

yuyan
yuyan

スコア7

test CHANGED
File without changes
test CHANGED
@@ -14,4 +14,42 @@
14
14
 
15
15
 
16
16
 
17
+ 現状右に移動するだけの動作はできています。
18
+
19
+
20
+
21
+ -------------------------------------
22
+
23
+
24
+
25
+ var startTime = Date.now();
26
+
27
+ var box = document.getElementsByClassName("rect");
28
+
29
+ var myTime = 500;
30
+
31
+ function rect() {
32
+
33
+ var current = new Date() - startTime;
34
+
35
+ if( current < myTime ) {
36
+
37
+ var id = setTimeout(rect, 10);
38
+
39
+ console.log(current);
40
+
41
+ box[0].style.marginLeft = 20 + 20 * (current / myTime) + "px";
42
+
43
+ }
44
+
45
+ }
46
+
47
+ rect();
48
+
49
+
50
+
51
+ -------------------------------------
52
+
53
+
54
+
17
55
  どうぞよろしくお願いいたします。