質問編集履歴

1

回答していただいたとおりに一度打ちこんでみましたが動きませんでした。

2018/01/08 07:04

投稿

ssssss
ssssss

スコア17

test CHANGED
File without changes
test CHANGED
@@ -142,6 +142,14 @@
142
142
 
143
143
  }
144
144
 
145
+ .hide{
146
+
147
+ display:none;
148
+
149
+ }
150
+
151
+
152
+
145
153
  .twoo{
146
154
 
147
155
  font-size: 20px;
@@ -156,14 +164,18 @@
156
164
 
157
165
 
158
166
 
159
-
160
-
161
167
  #section2{ background-size: cover;
162
168
 
163
169
  background-image: url(ari2.jpg);
164
170
 
165
171
  }
166
172
 
173
+ #section3{ background-size: cover;
174
+
175
+ background-image: url(ari3.jpg);
176
+
177
+ }
178
+
167
179
 
168
180
 
169
181
 
@@ -214,7 +226,7 @@
214
226
 
215
227
  <p class="a"><input id="A" type="button" value="btn"></p>
216
228
 
217
- <p class="two">
229
+ <ul class="hide">
218
230
 
219
231
  <li class="twoo">16歳の人魚姫・アリエルは、地上に憧れる少女でした。</li>
220
232
 
@@ -222,7 +234,7 @@
222
234
 
223
235
  <li class="twoo">しょっちゅう王国を抜けだしては、外の世界を冒険しました。</li>
224
236
 
225
- </p>
237
+ </ul>
226
238
 
227
239
  </div>
228
240
 
@@ -286,13 +298,21 @@
286
298
 
287
299
  $('#A').click(function(e) {
288
300
 
301
+ $('.twoo.hide').removeClass('hide');
302
+
289
- $('.twoo').animate({
303
+ $('.twoo').animate({
290
-
304
+
291
- 'marginLeft': '550px'
305
+ 'marginLeft': '550px'
292
-
306
+
293
- },2000);
307
+ },2000);
294
-
308
+
295
- });
309
+ });
310
+
311
+
312
+
313
+
314
+
315
+
296
316
 
297
317
 
298
318
 
@@ -308,6 +328,8 @@
308
328
 
309
329
 
310
330
 
331
+
332
+
311
333
  ```
312
334
 
313
335
  jQueryでボタンを押したら文字が表示され、指定の位置に移動させたいです。