質問編集履歴

2

コードブロック追記

2017/05/26 10:23

投稿

amaotosarasa
amaotosarasa

スコア14

test CHANGED
File without changes
test CHANGED
@@ -74,7 +74,9 @@
74
74
 
75
75
  ```
76
76
 
77
+
78
+
77
- css
79
+ ```css
78
80
 
79
81
  @carset "utf-8";
80
82
 
@@ -112,6 +114,8 @@
112
114
 
113
115
  }
114
116
 
117
+ ```
118
+
115
119
 
116
120
 
117
121
 

1

コードを書き直しました

2017/05/26 10:23

投稿

amaotosarasa
amaotosarasa

スコア14

test CHANGED
File without changes
test CHANGED
@@ -4,17 +4,117 @@
4
4
 
5
5
 
6
6
 
7
- $(function(){
7
+ ```html,jQuery
8
8
 
9
- $("dd:not(:first)").css("display","none");
9
+ <!DOCTYPE html>
10
10
 
11
- $("dl dt").click(function(){
11
+ <html>
12
12
 
13
- if($("+dd",this).css("display")=="none"){
13
+ <head>
14
14
 
15
- $("dd").slideUp("slow");
15
+ <meta charset="utf-8">
16
16
 
17
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
18
+
19
+ <title>アコーディオン</title>
20
+
21
+ <link rel="stylesheet" href="style.css">
22
+
23
+ <script type="text/javascript" src="../js/jquery-3.2.1.min.js"></script>
24
+
25
+ <script>
26
+
27
+ $(function(){
28
+
29
+ $("dd:not(:first)").css("display","none");
30
+
31
+ $("dl dt").click(function(){
32
+
33
+ if($("+dd",this).css("display")=="none"){
34
+
35
+ $("dd").slideUp("slow");
36
+
17
- $("+dd",this).slideDown("slow");
37
+ $("+dd",this).slideDown("slow");
38
+
39
+ }
40
+
41
+ });
42
+
43
+ });
44
+
45
+ </script>
46
+
47
+ </head>
48
+
49
+ <body>
50
+
51
+ <dl>
52
+
53
+ <dt>step.1</dt>
54
+
55
+ <dd>テキスト1</dd>
56
+
57
+ <dt>step.2</dt>
58
+
59
+ <dd>テキスト2</dd>
60
+
61
+ <dt>step.3</dt>
62
+
63
+ <dd>テキスト3</dd>
64
+
65
+
66
+
67
+ </dl>
68
+
69
+ </body>
70
+
71
+ </html>
72
+
73
+
74
+
75
+ ```
76
+
77
+ css
78
+
79
+ @carset "utf-8";
80
+
81
+
82
+
83
+ dl{
84
+
85
+ width: 500px;
86
+
87
+ }
88
+
89
+
90
+
91
+ dt{
92
+
93
+ line-height: 35px;
94
+
95
+ font-size: 16px;
96
+
97
+ font-weight: bold;
98
+
99
+ background-color: #ddf;
100
+
101
+ }
102
+
103
+ dd{
104
+
105
+ height: 300px;
106
+
107
+ margin: 0;
108
+
109
+ padding: 0;
110
+
111
+ background-color: #ccc;
112
+
113
+ }
114
+
115
+
116
+
117
+
18
118
 
19
119
 
20
120