回答編集履歴

6

説明を修整

2020/05/01 23:02

投稿

nekora
nekora

スコア501

test CHANGED
@@ -1,6 +1,6 @@
1
1
  **要素をslideToggleで表示する時に既に表示されている要素をhideにするにはどのようにすればいいですか?**
2
2
 
3
- とのことですが、slideToggleでid="main1"のsapnタグが指定されているところから、これを非表示から表示して、.spanが付いている要素をhideしようとしてることから脳内補完しました。
3
+ とのことですが、slideToggleでid="main1"のsapnタグが指定されているところから、これを非表示から表示して、.spanが付いている要素をhideしようとしてることから"main1"のsapnタグ以外のspanタグを非表示にしたいと脳内補完しました。
4
4
 
5
5
 
6
6
 

5

コードの修正

2020/05/01 23:02

投稿

nekora
nekora

スコア501

test CHANGED
@@ -1,3 +1,9 @@
1
+ **要素をslideToggleで表示する時に既に表示されている要素をhideにするにはどのようにすればいいですか?**
2
+
3
+ とのことですが、slideToggleでid="main1"のsapnタグが指定されているところから、これを非表示から表示して、.spanが付いている要素をhideしようとしてることから脳内補完しました。
4
+
5
+
6
+
1
7
  こんな感じでいいですか? 意図的にアニメーションの時間を指定して、動作が確認できるようにしてあります。
2
8
 
3
9
 

4

コードの修正

2020/05/01 16:49

投稿

nekora
nekora

スコア501

test CHANGED
@@ -16,11 +16,21 @@
16
16
 
17
17
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
18
18
 
19
+ <style>
20
+
21
+ #main1 {
22
+
23
+ display: none;
24
+
25
+ }
26
+
27
+ </style>
28
+
19
29
  </head>
20
30
 
21
31
  <body>
22
32
 
23
- <p id="text1">text1</p><sapn class="span" id="main1">main1</sapn>
33
+ <p id="text1">text1</p><sapn id="main1">main1</sapn>
24
34
 
25
35
  <p id="text2">text2</p><sapn class="span" id="main2">main2</sapn>
26
36
 
@@ -34,7 +44,7 @@
34
44
 
35
45
  $("#main1").slideToggle(3000);
36
46
 
37
- $(".span").hide(1500);
47
+ $(".span").hide(6000);
38
48
 
39
49
  });
40
50
 

3

コードを修正

2020/05/01 16:39

投稿

nekora
nekora

スコア501

test CHANGED
@@ -32,7 +32,7 @@
32
32
 
33
33
  $("#text1").click(function(){
34
34
 
35
- $("#main1").slideToggle(1500);
35
+ $("#main1").slideToggle(3000);
36
36
 
37
37
  $(".span").hide(1500);
38
38
 

2

コードを修正

2020/05/01 15:36

投稿

nekora
nekora

スコア501

test CHANGED
@@ -32,15 +32,15 @@
32
32
 
33
33
  $("#text1").click(function(){
34
34
 
35
- $(".span").hide();
35
+ $("#main1").slideToggle(1500);
36
36
 
37
- $("#main1").slideToggle(1500);
37
+ $(".span").hide(1500);
38
38
 
39
39
  });
40
40
 
41
41
  </script>
42
42
 
43
-
43
+
44
44
 
45
45
  </body>
46
46
 

1

説明を修整

2020/05/01 15:26

投稿

nekora
nekora

スコア501

test CHANGED
@@ -51,3 +51,11 @@
51
51
 
52
52
 
53
53
  これで、意図したものになってるといいんですが・・・
54
+
55
+ あとスクリプトを書いた位置head内かbody内かで実行順序が変わったりしますので
56
+
57
+ これくらいの短いコードのときは省略せず全部記載して公開した方がいいですよー
58
+
59
+ 公開されてない部分はこちらで脳内補完させていただきました。
60
+
61
+ なので、そこが原因で意図したものと違ってた場合はごめんなさい