teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

2

修正

2015/10/09 13:37

投稿

退会済みユーザー
answer CHANGED
@@ -1,11 +1,36 @@
1
+ ```html
2
+ <!DOCTYPE HTML>
3
+ <html lang="en-US">
1
- ```javascript
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <title></title>
7
+ </head>
8
+ <body>
9
+ <div>
10
+ <p class="book_toggle_btn">↑ DETAIL<p>
11
+ <ul class="book_toggle">
12
+ <li>2015.10.06 update</li>
13
+ <li>【NIZIIRO Weekly Vol.○○】タイトルタイトルタイトル</li>
14
+ <li>【NIZIIRO Weekly Vol.○○】タイトルタイトルタイトル</li>
15
+ <li>【NIZIIRO Weekly Vol.○○】タイトルタイトルタイトル</li>
16
+ </ul>
17
+ <p class="book_toggle_btn">↑ DETAIL<p>
18
+ <ul class="book_toggle">
19
+ <li>2015.10.06 update</li>
20
+ <li>【NIZIIRO Weekly Vol.○○】タイトルタイトルタイトル</li>
21
+ <li>【NIZIIRO Weekly Vol.○○】タイトルタイトルタイトル</li>
22
+ <li>【NIZIIRO Weekly Vol.○○】タイトルタイトルタイトル</li>
23
+ </ul>
24
+ </div>
25
+ <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
26
+ <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
2
- <script type="text/javascript">
27
+ <script type="text/javascript">
3
- $(function(){
28
+ $(function () {
4
- $(".book_toggle_btn").click(function() {
29
+ $(".book_toggle_btn").on("click", function () {
5
- $(this).next().find(".book_toggle").slideToggle();
30
+ $(this).nextAll('.book_toggle:first').slideToggle();
6
- $(this).next().toggleClass("nav");
7
- });
31
+ });
8
- });
32
+ });
9
- </script>
33
+ </script>
10
-
34
+ </body>
35
+ </html>
11
36
  ```

1

修正

2015/10/09 13:37

投稿

退会済みユーザー
answer CHANGED
@@ -2,8 +2,8 @@
2
2
  <script type="text/javascript">
3
3
  $(function(){
4
4
  $(".book_toggle_btn").click(function() {
5
- $(this).find(".book_toggle").slideToggle();
5
+ $(this).next().find(".book_toggle").slideToggle();
6
- $(this).toggleClass("nav");
6
+ $(this).next().toggleClass("nav");
7
7
  });
8
8
  });
9
9
  </script>