回答編集履歴

1

追記

2021/01/28 01:31

投稿

hatena19
hatena19

スコア33775

test CHANGED
@@ -81,3 +81,53 @@
81
81
  }
82
82
 
83
83
  ```
84
+
85
+ 追記
86
+
87
+ ---
88
+
89
+ コメントで、下記の仕様が追加されましたので書き換えました。
90
+
91
+ - 「前へ」、「次へ」ボタン
92
+
93
+ - 次へを押して終わりなら、最初に戻す。
94
+
95
+ - 前へを押して終わりなら、最後に戻す。
96
+
97
+
98
+
99
+ ```js
100
+
101
+ let i = -1;
102
+
103
+ let targets = document.querySelectorAll('.texts > p');
104
+
105
+
106
+
107
+ document.getElementById("back-btn").onclick = function() {
108
+
109
+ i <= 0 ? i=targets.length - 1 : i--;
110
+
111
+ setShow(i);
112
+
113
+ }
114
+
115
+ document.getElementById("next-btn").onclick = function() {
116
+
117
+ i >= targets.length - 1 ? i=0 : i++;
118
+
119
+ setShow(i);
120
+
121
+ }
122
+
123
+ function setShow(i) {
124
+
125
+ let el = document.querySelector('p.show');
126
+
127
+ if(el){el.classList.remove("show")};
128
+
129
+ targets[i].classList.add("show");
130
+
131
+ }
132
+
133
+ ```