質問編集履歴

1

CSSの追加、タグの追加 参考サイトの追加

2020/10/11 09:57

投稿

sugarsugar
sugarsugar

スコア2

test CHANGED
File without changes
test CHANGED
@@ -6,6 +6,12 @@
6
6
 
7
7
  ボタンを押したら残りを表示するというのを三箇所で実施したいです。
8
8
 
9
+ 以下のサイトを参考にしました。
10
+
11
+ https://codepen.io/m_t_of/pen/YaROLY
12
+
13
+
14
+
9
15
 
10
16
 
11
17
  上の二つは問題なく表示されるのですが、
@@ -116,11 +122,19 @@
116
122
 
117
123
  ```
118
124
 
119
-
125
+ ```css
126
+
120
-
127
+ .is-hidden {
121
-
122
-
128
+
123
- ### ヘディングのテキスト
129
+ display: none;
130
+
131
+ }
132
+
133
+ ```
134
+
135
+
136
+
137
+ ###
124
138
 
125
139
  ```js
126
140
 
@@ -376,7 +390,7 @@
376
390
 
377
391
  var partbtn = $('.partmore');
378
392
 
379
- var classname = "is-hidden";
393
+ var className = "is-hidden";
380
394
 
381
395
 
382
396
 
@@ -416,13 +430,13 @@
416
430
 
417
431
  if (addCount === 3) {
418
432
 
419
- $(this).addClass(classname);
433
+ $(this).addClass(className);
420
434
 
421
435
  return;
422
436
 
423
437
  }
424
438
 
425
- if (!$(this).hasClass(classname)) {
439
+ if (!$(this).hasClass(className)) {
426
440
 
427
441
  addCount++;
428
442
 
@@ -446,11 +460,11 @@
446
460
 
447
461
  $(partbtn).on('click', function () {
448
462
 
449
- var hiddensLength = $('.part_toggle').children('li.is-hidden').length; //非表示のリスト数
463
+ var hiddenLength = $('.part_toggle').children('li.is-hidden').length; //非表示のリスト数
450
-
451
-
452
-
464
+
465
+
466
+
453
- if (hiddensLength === 0) {
467
+ if (hiddenLength === 0) {
454
468
 
455
469
  return; //非表示のものが無ければ何もしない
456
470
 
@@ -470,11 +484,11 @@
470
484
 
471
485
 
472
486
 
473
- if ($(this).hasClass(classname)) {
487
+ if ($(this).hasClass(className)) {
474
488
 
475
489
  var hiddenLength = $('.part_toggle').children('li.is-hidden').length; //非表示のリスト数
476
490
 
477
- $(this).removeClass(classname);
491
+ $(this).removeClass(className);
478
492
 
479
493
  moreCount++;
480
494
 
@@ -484,7 +498,7 @@
484
498
 
485
499
  //全部表示したらボタン削除
486
500
 
487
- if (hiddensLength === 1) {
501
+ if (hiddenLength === 1) {
488
502
 
489
503
  $(partbtn).hide();
490
504
 
@@ -494,6 +508,6 @@
494
508
 
495
509
  });
496
510
 
497
- }());
511
+
498
512
 
499
513
  ```