teratail
回答率
85.47%
質問するログイン新規登録
トップに関する質問svgでアニメーションをつくったのだが、htmlに挿入の仕方がわからない

編集履歴

質問編集履歴

9

違う方コメントアウトしてました。

2016/07/06 17:49

投稿

Tan3
Tan3

スコア39

test CHANGED
File without changes
test CHANGED
@@ -68,33 +68,33 @@
68
68
 
69
69
  var $svg_elems = $('#kkss3');
70
70
 
71
- $svg_elems.lazylinepainter(
71
+ //$svg_elems.lazylinepainter(
72
72
 
73
- {
73
+ //{
74
74
 
75
- "svgData": pathObj,
75
+ //"svgData": pathObj,
76
76
 
77
- "strokeWidth": 2, //線の太さ
77
+ //"strokeWidth": 2, //線の太さ
78
78
 
79
- "strokeColor": "#fff" //線の色
79
+ //"strokeColor": "#fff" //線の色
80
80
 
81
- }).lazylinepainter('paint');
81
+ //}).lazylinepainter('paint');
82
82
 
83
83
 
84
84
 
85
85
  //かとべとしょごたんSVG
86
86
 
87
- // $('#kkss3').lazylinepainter(
87
+ $('#kkss3').lazylinepainter(
88
88
 
89
- //{
89
+ {
90
90
 
91
- //"svgData": pathObj,
91
+ "svgData": pathObj,
92
92
 
93
- //"strokeWidth": 3, //線の太さ
93
+ "strokeWidth": 3, //線の太さ
94
94
 
95
- //"strokeColor": "#666666" //線の色
95
+ "strokeColor": "#666666" //線の色
96
96
 
97
- //}).lazylinepainter('paint');
97
+ }).lazylinepainter('paint');
98
98
 
99
99
  ```
100
100
 

8

ご指摘の箇所を修正しました

2016/07/06 17:49

投稿

Tan3
Tan3

スコア39

test CHANGED
File without changes
test CHANGED
@@ -42,7 +42,9 @@
42
42
 
43
43
  </div>
44
44
 
45
- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
45
+ <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
46
+
47
+ <script src="js/jquery.lazylinepainter-1.7.0.min.js"></script>
46
48
 
47
49
  <script src="js/kkssillust.js"></script>
48
50
 
@@ -82,19 +84,17 @@
82
84
 
83
85
  //かとべとしょごたんSVG
84
86
 
85
- $('#kkss3').lazylinepainter(
87
+ // $('#kkss3').lazylinepainter(
86
88
 
87
- {
89
+ //{
88
90
 
89
- "svgData": pathObj,
91
+ //"svgData": pathObj,
90
92
 
91
- "strokeWidth": 3, //線の太さ
93
+ //"strokeWidth": 3, //線の太さ
92
94
 
93
- "strokeColor": "#666666" //線の色
95
+ //"strokeColor": "#666666" //線の色
94
96
 
95
- }).lazylinepainter('paint');
97
+ //}).lazylinepainter('paint');
96
-
97
-
98
98
 
99
99
  ```
100
100
 
@@ -102,4 +102,16 @@
102
102
 
103
103
  ###表示されているエラー
104
104
 
105
+ Error: <path> attribute d: Expected number, "M 446.6,195. L 474.4,244…".
106
+
107
+
108
+
105
- kkssscript.js:3 Uncaught TypeError: $svg_elems.lazylinepainter is not a function(anonymous function) @ kkssscript.js:3
109
+ jquery.js:7975 Error: <path> attribute d: Expected number, "M 437.6,212. L 456.3,244…".
110
+
111
+
112
+
113
+ Error: <path> attribute d: Expected number, "M 530.2,147. L 558,195.5…".
114
+
115
+
116
+
117
+ jquery.lazylinepainter-1.7.0.min.js:10 Uncaught TypeError: Cannot read property 'x' of undefined

7

エラーが後一つまでへりました・・・！

2016/07/06 17:46

投稿

Tan3
Tan3

スコア39

test CHANGED
File without changes
test CHANGED
@@ -102,6 +102,4 @@
102
102
 
103
103
  ###表示されているエラー
104
104
 
105
- kkssscript.js:3 Uncaught TypeError: $svg_elems.lazylinepainter is not a function
105
+ kkssscript.js:3 Uncaught TypeError: $svg_elems.lazylinepainter is not a function(anonymous function) @ kkssscript.js:3
106
-
107
- kkssillust.js:210 Uncaught TypeError: $(...).lazylinepainter is not a function

6

kkssscript\.jsはこれです

2016/07/06 17:33

投稿

Tan3
Tan3

スコア39

test CHANGED
File without changes
test CHANGED
@@ -58,7 +58,7 @@
58
58
 
59
59
 
60
60
 
61
- ###該当のソースコード
61
+ ###kkssscript.js
62
62
 
63
63
  ```javascript
64
64
 

5

エラーを追加

2016/07/06 17:10

投稿

Tan3
Tan3

スコア39

test CHANGED
File without changes
test CHANGED
@@ -102,10 +102,6 @@
102
102
 
103
103
  ###表示されているエラー
104
104
 
105
+ kkssscript.js:3 Uncaught TypeError: $svg_elems.lazylinepainter is not a function
105
106
 
106
-
107
- file://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js Failed to load resource: net::ERR_FILE_NOT_FOUND
107
+ kkssillust.js:210 Uncaught TypeError: $(...).lazylinepainter is not a function
108
-
109
- file:///Users/tan3/Desktop/kyouensyamatome3%202/js/kkssillust.js Failed to load resource: net::ERR_FILE_NOT_FOUND
110
-
111
- file:///Users/tan3/Desktop/kyouensyamatome3%202/js/kkssscript.js Failed to load resource: net::ERR_FILE_NOT_FOUND

4

誤字

2016/07/06 17:04

投稿

Tan3
Tan3

スコア39

test CHANGED
File without changes
test CHANGED
@@ -106,6 +106,6 @@
106
106
 
107
107
  file://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js Failed to load resource: net::ERR_FILE_NOT_FOUND
108
108
 
109
- file:///Users/tsutsumi/Desktop/kyouensyamatome3%202/js/kkssillust.js Failed to load resource: net::ERR_FILE_NOT_FOUND
109
+ file:///Users/tan3/Desktop/kyouensyamatome3%202/js/kkssillust.js Failed to load resource: net::ERR_FILE_NOT_FOUND
110
110
 
111
- file:///Users/tsutsumi/Desktop/kyouensyamatome3%202/js/kkssscript.js Failed to load resource: net::ERR_FILE_NOT_FOUND
111
+ file:///Users/tan3/Desktop/kyouensyamatome3%202/js/kkssscript.js Failed to load resource: net::ERR_FILE_NOT_FOUND

3

エラーを追加

2016/07/06 16:37

投稿

Tan3
Tan3

スコア39

test CHANGED
File without changes
test CHANGED
@@ -97,3 +97,15 @@
97
97
 
98
98
 
99
99
  ```
100
+
101
+
102
+
103
+ ###表示されているエラー
104
+
105
+
106
+
107
+ file://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js Failed to load resource: net::ERR_FILE_NOT_FOUND
108
+
109
+ file:///Users/tsutsumi/Desktop/kyouensyamatome3%202/js/kkssillust.js Failed to load resource: net::ERR_FILE_NOT_FOUND
110
+
111
+ file:///Users/tsutsumi/Desktop/kyouensyamatome3%202/js/kkssscript.js Failed to load resource: net::ERR_FILE_NOT_FOUND

2

指摘の箇所を修正

2016/07/06 14:36

投稿

Tan3
Tan3

スコア39

test CHANGED
File without changes
test CHANGED
@@ -41,6 +41,8 @@
41
41
  <div id="kkss3">
42
42
 
43
43
  </div>
44
+
45
+ <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
44
46
 
45
47
  <script src="js/kkssillust.js"></script>
46
48
 

1

初心者マーク

2016/07/06 14:22

投稿

Tan3
Tan3

スコア39

test CHANGED
File without changes
test CHANGED
File without changes