質問編集履歴
1
CSSの追加、タグの追加 参考サイトの追加
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 class
|
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(class
|
433
|
+
$(this).addClass(className);
|
420
434
|
|
421
435
|
return;
|
422
436
|
|
423
437
|
}
|
424
438
|
|
425
|
-
if (!$(this).hasClass(class
|
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 hidden
|
463
|
+
var hiddenLength = $('.part_toggle').children('li.is-hidden').length; //非表示のリスト数
|
450
|
-
|
451
|
-
|
452
|
-
|
464
|
+
|
465
|
+
|
466
|
+
|
453
|
-
if (hidden
|
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(class
|
487
|
+
if ($(this).hasClass(className)) {
|
474
488
|
|
475
489
|
var hiddenLength = $('.part_toggle').children('li.is-hidden').length; //非表示のリスト数
|
476
490
|
|
477
|
-
$(this).removeClass(class
|
491
|
+
$(this).removeClass(className);
|
478
492
|
|
479
493
|
moreCount++;
|
480
494
|
|
@@ -484,7 +498,7 @@
|
|
484
498
|
|
485
499
|
//全部表示したらボタン削除
|
486
500
|
|
487
|
-
if (hidden
|
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
|
```
|