質問編集履歴
6
修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -163,10 +163,10 @@
|
|
|
163
163
|
|
|
164
164
|
|
|
165
165
|
<div class="single-item">
|
|
166
|
-
<div><img src="
|
|
166
|
+
<div><img src="img.jpg"></div>
|
|
167
|
-
<div><img src="
|
|
167
|
+
<div><img src="img.jpg"></div>
|
|
168
|
-
<div><img src="
|
|
168
|
+
<div><img src="img.jpg"></div>
|
|
169
|
-
<div><img src="
|
|
169
|
+
<div><img src="img.jpg"></div>
|
|
170
170
|
</div>
|
|
171
171
|
|
|
172
172
|
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
|
5
再記述等しました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -145,4 +145,45 @@
|
|
|
145
145
|
まだやっていませんが、改めて確認です。
|
|
146
146
|
（別業務終わり次第、着手やります）
|
|
147
147
|
デベロッパーツールは
|
|
148
|
-
「slick.min.js:17 Uncaught TypeError: a.type is not a function」となりました。
|
|
148
|
+
「slick.min.js:17 Uncaught TypeError: a.type is not a function」となりました。
|
|
149
|
+
|
|
150
|
+
|
|
151
|
+
|
|
152
|
+
【再々々記述】
|
|
153
|
+
お仕事でお忙しい中、初心者の分不相応の愚問にお答えいただき本当にすみません。そして、ありがとうございます。
|
|
154
|
+
|
|
155
|
+
```ここに言語を入力
|
|
156
|
+
<html>
|
|
157
|
+
<head>
|
|
158
|
+
<link rel="stylesheet" href="css/slick.css">
|
|
159
|
+
<link rel="stylesheet" href="css/slick-theme.css">
|
|
160
|
+
|
|
161
|
+
</head>
|
|
162
|
+
<body>
|
|
163
|
+
|
|
164
|
+
|
|
165
|
+
<div class="single-item">
|
|
166
|
+
<div><img src="https://image.rakuten.co.jp/kodawarigurashi/cabinet/tool/kgind_boots_icow.jpg"></div>
|
|
167
|
+
<div><img src="https://image.rakuten.co.jp/kodawarigurashi/cabinet/tool/kgind_pumps_icow.jpg"></div>
|
|
168
|
+
<div><img src="https://image.rakuten.co.jp/kodawarigurashi/cabinet/tool/kgind_boots_icom.jpg"></div>
|
|
169
|
+
<div><img src="https://image.rakuten.co.jp/kodawarigurashi/cabinet/tool/kgind_sabot_icom.jpg"></div>
|
|
170
|
+
</div>
|
|
171
|
+
|
|
172
|
+
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
|
|
173
|
+
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"></script>
|
|
174
|
+
<script type="text/javascript">
|
|
175
|
+
$(function() {
|
|
176
|
+
$('.single-item').slick();
|
|
177
|
+
});
|
|
178
|
+
</script>
|
|
179
|
+
|
|
180
|
+
|
|
181
|
+
</body>
|
|
182
|
+
</html>
|
|
183
|
+
```
|
|
184
|
+
|
|
185
|
+
お教えくださっている順番
|
|
186
|
+
①jQuery本体js→ https://code.jquery.com/jquery-2.2.4.min.js
|
|
187
|
+
②jQueryプラグイン本体js→ https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js
|
|
188
|
+
③jQueryプラグイン利用の記述→ <script type="text/javascript">～</script>
|
|
189
|
+
であっておりますでしょうか？
|
4
記述を修正しました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -103,14 +103,14 @@
|
|
|
103
103
|
|
|
104
104
|
|
|
105
105
|
－－－－－－－－－－－－－－－－－－－－－
|
|
106
|
-
【再記述】
|
|
106
|
+
【再再記述】
|
|
107
|
+
◎順番を直しました。
|
|
107
|
-
|
|
108
|
+
◎変えるつもりがないのでjs/slick.min.js だけにしました。
|
|
108
109
|
|
|
109
110
|
|
|
110
111
|
```ここに言語を入力
|
|
111
112
|
<html>
|
|
112
113
|
<head>
|
|
113
|
-
<script src="js/jquery.js"></script>
|
|
114
114
|
<link rel="stylesheet" href="css/slick.css">
|
|
115
115
|
<link rel="stylesheet" href="css/slick-theme.css">
|
|
116
116
|
|
|
@@ -131,13 +131,18 @@
|
|
|
131
131
|
<div><img src="img4.jpg"></div>
|
|
132
132
|
</div>
|
|
133
133
|
|
|
134
|
+
<script src="js/jquery.js"></script>
|
|
134
|
-
<script src="js/slick.js"></script>
|
|
135
|
+
<script src="js/slick.min.js"></script>
|
|
135
|
-
<script type="text/javascript" src="js/slick.min.js"></script>
|
|
136
136
|
</body>
|
|
137
137
|
</html>
|
|
138
138
|
```
|
|
139
139
|
|
|
140
|
-
|
|
140
|
+
プラグインをCDNにというのは、
|
|
141
|
+
こちら側でファイルを落としてリンクさせるのではなく、
|
|
142
|
+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
|
|
143
|
+
のように、リンク先で記述するということの認識でよろしいでしょうか。
|
|
144
|
+
|
|
145
|
+
まだやっていませんが、改めて確認です。
|
|
141
|
-
（
|
|
146
|
+
（別業務終わり次第、着手やります）
|
|
142
147
|
デベロッパーツールは
|
|
143
148
|
「slick.min.js:17 Uncaught TypeError: a.type is not a function」となりました。
|
3
記述を追加しました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -99,4 +99,45 @@
|
|
|
99
99
|
|
|
100
100
|
Webもテラテイルも初心者中の初心者です。
|
|
101
101
|
（2回目の質問でやっと初心者マークなどが分かったようなレベルです、すみません）
|
|
102
|
-
お手数ですが、ご回答よろしくお願いいたします。
|
|
102
|
+
お手数ですが、ご回答よろしくお願いいたします。
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
－－－－－－－－－－－－－－－－－－－－－
|
|
106
|
+
【再記述】
|
|
107
|
+
スクリプトをまず最低限のものにするのと、ご回答を参照しながら記述しました。
|
|
108
|
+
|
|
109
|
+
|
|
110
|
+
```ここに言語を入力
|
|
111
|
+
<html>
|
|
112
|
+
<head>
|
|
113
|
+
<script src="js/jquery.js"></script>
|
|
114
|
+
<link rel="stylesheet" href="css/slick.css">
|
|
115
|
+
<link rel="stylesheet" href="css/slick-theme.css">
|
|
116
|
+
|
|
117
|
+
<script type="text/javascript">
|
|
118
|
+
$(function() {
|
|
119
|
+
$('.single-item').slick();
|
|
120
|
+
});
|
|
121
|
+
</script>
|
|
122
|
+
|
|
123
|
+
</head>
|
|
124
|
+
<body>
|
|
125
|
+
|
|
126
|
+
|
|
127
|
+
<div class="single-item">
|
|
128
|
+
<div><img src="img1.jpg"></div>
|
|
129
|
+
<div><img src="img2.jpg"></div>
|
|
130
|
+
<div><img src="img3.jpg"></div>
|
|
131
|
+
<div><img src="img4.jpg"></div>
|
|
132
|
+
</div>
|
|
133
|
+
|
|
134
|
+
<script src="js/slick.js"></script>
|
|
135
|
+
<script type="text/javascript" src="js/slick.min.js"></script>
|
|
136
|
+
</body>
|
|
137
|
+
</html>
|
|
138
|
+
```
|
|
139
|
+
|
|
140
|
+
別業務と並行作業中のため、プラグインをCDNにして試すのはまだやっていません。
|
|
141
|
+
（すみません、別業務終わり次第やります）
|
|
142
|
+
デベロッパーツールは
|
|
143
|
+
「slick.min.js:17 Uncaught TypeError: a.type is not a function」となりました。
|
2
質問内容を改めて書き直しました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
【内容書き直しました】
|
|
2
|
+
|
|
1
3
|
スマホサイトを制作中です。
|
|
2
4
|
|
|
3
5
|
[e-zakkaさんのスマホサイト](https://www.rakuten.ne.jp/gold/e-zakkamania/mobile/sp_html/)
|
|
@@ -10,27 +12,17 @@
|
|
|
10
12
|
のレスポンシブディスプレイの記述です。
|
|
11
13
|
スクリプトの「$('.**responsive**')」のところがdivのclass名だと思い、slickに変えています。
|
|
12
14
|
|
|
13
|
-
記述としては、
|
|
14
|
-
▼head上部に
|
|
15
|
-
<link rel="stylesheet" href="css/slick.css" />
|
|
16
|
-
<link rel="stylesheet" href="css/slick-theme.css">
|
|
17
|
-
|
|
15
|
+
※先記述の＜CSS＞は＜Javascript＞の誤りでした。申し訳ありません。
|
|
18
16
|
|
|
17
|
+
該当記述の順番です。↓
|
|
19
18
|
|
|
20
19
|
|
|
21
|
-
＜html＞
|
|
22
20
|
```ここに言語を入力
|
|
23
|
-
<
|
|
21
|
+
<html>
|
|
24
|
-
<div><img src="img1.jpg"></div>
|
|
25
|
-
<div><img src="img2.jpg"></div>
|
|
26
|
-
<div><img src="img3.jpg"></div>
|
|
27
|
-
<div><img src="img4.jpg"></div>
|
|
28
|
-
<div><img src="img5.jpg"></div>
|
|
29
|
-
<
|
|
22
|
+
<head>
|
|
23
|
+
<link rel="stylesheet" href="css/slick.css" />
|
|
24
|
+
<link rel="stylesheet" href="css/slick-theme.css">
|
|
30
25
|
|
|
31
|
-
```
|
|
32
|
-
＜CSS＞
|
|
33
|
-
```ここに言語を入力
|
|
34
26
|
<script>
|
|
35
27
|
$(document).ready(function(){
|
|
36
28
|
$('.slick').slick({
|
|
@@ -70,19 +62,35 @@
|
|
|
70
62
|
});
|
|
71
63
|
</script>
|
|
72
64
|
|
|
65
|
+
</head>
|
|
73
|
-
|
|
66
|
+
<body>
|
|
74
67
|
|
|
68
|
+
（看板と看板直下に検索入力ボックスとボタン）
|
|
69
|
+
|
|
70
|
+
<div class="slick">
|
|
71
|
+
<div><img src="img1.jpg"></div>
|
|
72
|
+
<div><img src="img2.jpg"></div>
|
|
73
|
+
<div><img src="img3.jpg"></div>
|
|
74
|
+
<div><img src="img4.jpg"></div>
|
|
75
|
+
<div><img src="img5.jpg"></div>
|
|
75
|
-
|
|
76
|
+
</div>
|
|
77
|
+
|
|
76
78
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
|
|
77
79
|
<script src="js/slick.js"></script>
|
|
78
80
|
|
|
79
|
-
|
|
81
|
+
</body>
|
|
82
|
+
</html>
|
|
80
83
|
|
|
81
|
-
|
|
84
|
+
```
|
|
82
|
-
|
|
85
|
+
|
|
86
|
+
|
|
83
87
|
img1～5が縦並び状態です。
|
|
84
88
|
ローカルもサーバー上も同状態です。
|
|
85
89
|
|
|
90
|
+
Chromeのデベロッパーツールのコンソールには
|
|
91
|
+
「Uncaught SyntaxError: Unexpected end of input」の赤バツがでており
|
|
92
|
+
ソースを見ると</script>に赤バツがついています。
|
|
93
|
+
|
|
86
94
|
－－－－－－－－－－
|
|
87
95
|
まず、ちゃんと動作するようにしたいです。
|
|
88
96
|
どこがおかしいのか、ご指摘よろしくお願いいたします。
|
|
@@ -91,14 +99,4 @@
|
|
|
91
99
|
|
|
92
100
|
Webもテラテイルも初心者中の初心者です。
|
|
93
101
|
（2回目の質問でやっと初心者マークなどが分かったようなレベルです、すみません）
|
|
94
|
-
お手数ですが、ご回答よろしくお願いいたします。
|
|
102
|
+
お手数ですが、ご回答よろしくお願いいたします。
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
【追記】
|
|
99
|
-
ご指摘ありがとうございます。追加の質問は削除いたしました。
|
|
100
|
-
|
|
101
|
-
Chromeのデベロッパーツールのコンソールには
|
|
102
|
-
「Uncaught SyntaxError: Unexpected end of input」の赤バツがでており
|
|
103
|
-
ソースを見ると</script>に赤バツがついています。
|
|
104
|
-
よろしくお願いいたします。
|
1
文章を一部削除したのと、情報を追加しました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -87,15 +87,18 @@
|
|
|
87
87
|
まず、ちゃんと動作するようにしたいです。
|
|
88
88
|
どこがおかしいのか、ご指摘よろしくお願いいたします。
|
|
89
89
|
|
|
90
|
-
加えて、
|
|
91
|
-
可能であればもう1つ質問させてください。
|
|
92
|
-
同じページに、カルーセルメニューを複数設置したいのですが
|
|
93
|
-
その場合は、前述における「responsive→slick」に変更したように
|
|
94
|
-
class名分（設置個数分）スクリプトを貼りつけていけば良いのでしょうか？
|
|
95
|
-
（画像の大きさなどが変わるのでclass名同様オプションも変更しますが、基本の記述は同じものをコピペする）
|
|
96
|
-
それとも、bxSliderやOwl carousel みたいな別のものを用意した方がいいのでしょうか？
|
|
97
90
|
|
|
98
91
|
|
|
99
92
|
Webもテラテイルも初心者中の初心者です。
|
|
100
93
|
（2回目の質問でやっと初心者マークなどが分かったようなレベルです、すみません）
|
|
101
|
-
お手数ですが、ご回答よろしくお願いいたします。
|
|
94
|
+
お手数ですが、ご回答よろしくお願いいたします。
|
|
95
|
+
|
|
96
|
+
|
|
97
|
+
|
|
98
|
+
【追記】
|
|
99
|
+
ご指摘ありがとうございます。追加の質問は削除いたしました。
|
|
100
|
+
|
|
101
|
+
Chromeのデベロッパーツールのコンソールには
|
|
102
|
+
「Uncaught SyntaxError: Unexpected end of input」の赤バツがでており
|
|
103
|
+
ソースを見ると</script>に赤バツがついています。
|
|
104
|
+
よろしくお願いいたします。
|