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

質問編集履歴

1

修正

2018/10/26 06:10

投稿

tunnel
tunnel

スコア30

title CHANGED
@@ -1,1 +1,1 @@
1
- jqueryで疑似要素の取り出し方がわからない
1
+ 疑似要素の上書きの仕方がわからない
body CHANGED
@@ -1,4 +1,60 @@
1
+ 下記のaにマウスオーバーした時に.img-b:beforeのbackgroundを透明若しくは取り消ししたいです。
2
+ cssやjqueryでいい方法がありましたら教えてください。
1
- ```js
3
+ ```html
4
+ <div class="news">
5
+ <div class="h2">
6
+ <h2>WHAT'S NEWS</h2>
7
+ </div>
8
+ <div class="newsBox">
9
+ <div class="newsBox-1 newsB">
10
+ <a href="">
11
+ <div class="img-b">
12
+ <img src="img/news.kei1.jpg">
13
+ <h3>FROM KEI<br>2018.10.10</h3>
14
+ </div>
15
+ <p>【お知らせ】インタビュー(2回戦終了後)/男子テニスATPワールドツアー マスターズ1000 上海</p>
16
+ <p>大会第4日、2回戦 ウー・イービンとの戦いに勝利した錦織選手のインタビュー。※日本語は後半部分となります▶錦織圭 インタビュー(2回戦終了後)/男子テニスATPワールドツアー マスターズ1000 上海今すぐ動画をチェック!⇒</p>
17
+ </a>
18
+ </div>
19
+ <div class="newsBox-2 newsB">
20
+ <a href="">
21
+ <div class="img-b">
2
- $(this).find(".img-b:before").css({"background": "rgb(0,0,0,0.0)"});
22
+ <div class="img-box"></div>
23
+ <h3>RESULT</h3>
24
+ </div>
25
+ <p>上海 ロレックス・マスターズ</p>
26
+ <p>準決勝ロジャー・フェデラー(スイス)</p>
27
+ </a>
28
+ </div>
29
+ <div class="newsBox-3 newsB">
30
+ <a href="">
31
+ <div class="img-b">
32
+ <img src="img/news.kei3.jpg">
33
+ <h3>FROM KEI<br>2018.10.06</h3>
34
+ </div>
35
+ <p>【お知らせ】インタビュー(準決勝直後オンコート)/楽天ジャパンオープンテニス2018</p>
36
+ <p>大会第6日、準決勝に勝利し、同大会で4年ぶりの決勝進出を決めた錦織選手の試合直後のインタビュー!難敵リシャール・ガスケ選手との戦いを振り返るとともに、ダブルスに出場している内山選手へエールを送りました。▶錦織圭 インタビュー(準決勝直後オンコート)/楽天ジャパンオープンテニス2018動画をチェック!⇒</p>
37
+ </a>
38
+ </div>
39
+ </div>
3
40
  ```
41
+ ```css
42
+ .img-b {
43
+ position: relative;
44
+ }
45
+
46
+ .img-b img {
47
+ vertical-align: bottom;
48
+ }
49
+
50
+
51
+ .img-b:before {
52
+ content: '';
53
+ width: 500px;
54
+ height: 306px;
4
- このような感じで疑似要素を指定したいです。お願いいたします。
55
+ background: rgb(0,0,0,0.5);
56
+ position: absolute;
57
+ top: 0;
58
+ left: 0;
59
+
60
+ ```