jQueryのhoverイベントでマウスを離しても反応しません。

以下のコードを書いたのですが、マウスオーバー時は反映するのですが、マウスアウト時に反映しません。
ブラウザはgooglechromeでやりました。
コードの誤字脱字は無いと思うのですが、何が原因なのでしょうか？

HTML
1<ul class="social-a">
2 <li class="s-account"><img src="./img/mail-icon.gif" alt="mail"><a href="">メールアドレスで続行</a></li>
3 <li class="s-account"><img src="./img/facebook-icon.gif" alt="facebook"><a href="">Facebookで続行</a></li>
4 <li class="s-account"><img src="./img/google-icon.gif" alt="google"><a href="">Googleで続行</a></li>
5 <li class="s-account"><img src="./img/apple-icon.gif" alt="apple"><a href="">Appleで続行</a></li>
6</ul>

CSS
1.social-a li {
2  line-height: 44px;
3  width: 500px;
4  border: solid 2px #B0B0B0;
5  text-align: center;
6  margin-bottom: 15px;
7  border-radius: 10px;
8}
9.social-a li img {
10  float: left;
11  margin: 10px 0 0 10px;
12  width: 29px;
13  height: 25px;
14}
15.social-a li a {
16  font-size: 14px;
17  font-weight: 600;
18}

jQuery
1$(function() {
2
3  $(".s-account").hover(function() {
4    $(this).css('border', 'solid', '2px', '#000000');
5  }, function() {
6    $(this).css('border', 'solid', '2px', '#B0B0B0');
7  });
8
9});

行動規範の内容に同意します

回答1件

ベストアンサー

値は第二引数に入れます。

jQeury
1$('要素').css('プロパティ','値');

なのでこうだと思います。

jQeury
1$(function() {
2
3  $(".s-account").hover(function() {
4    $(this).css('border', 'solid 2px #000000');
5  }, function() {
6    $(this).css('border', 'solid 2px #B0B0B0');
7  });
8
9});

投稿2020/06/22 06:20

colette

総合スコア15

chair

2020/06/22 06:35

解決致しました！基礎ができてなかったです、すいません。ありがとうございました！

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう！

jQueryのhoverイベントでマウスを離しても反応しません。

関連した質問