ホバーアクションの解除について

js初心者です。
下記のような記述をしておりまして、クラス名「hoge-name」のテキストをクリックすると「hoge-inner」のbackgroundが切り替わる
仕様を作成しております。

現在、クリック、ホバー場合に、初期設定のimg02.gifから各リンク先の画像に切り替わるというところまでは実装できております。
ですが、マウスをはずした後についてはホバーの解除が出来ず、最後にホバーした画像のままになってしまいます。

解除の方法をいろいろ調べたのですが、うまく行きません。
また、クリックした際にhoge-nameのcolor、weightを変更したいのですが、こちらもうまく実装できませんでした。

初歩的なところで詰まってしまっているのは重々承知しているのですが、
ご教示いただけると幸いです。

よろしくお願いいたします。

<style type="text/css">
	.hoge-inner {
		background: url('../img/img01.gif') no-repeat center top;
</style>




			<div class="hoge">
				<div class="hoge-inner">
						<a href="img/img02.gif" class="hoge-name link01">リンク1</a>
						<a href="img/img03.gif" class="hoge-name link02">リンク2</a>
						<a href="img/img04.gif" class="hoge-name link03">リンク3</a>
					</div>
				</div>



<script type="text/javascript">
  $('.hoge-name').click(function(){
        var bglink = $(this).attr("href");
        $("div.hoge-inner")
         .css("background-image","url("+bglink+")");
         return false;
		});

		$('.hoge-name').hover(function(){
        var bglink = $(this).attr("href");
        $("div.hoge-inner")
         .css("background-image","url("+bglink+")");
         return false;
		});
</script>

kei344

2017/11/28 12:23

質問文のコードはコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。

skk969688

2017/11/28 15:30

大変失礼いたしました。修正いたしました。

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

回答1件

ベストアンサー

hoverの解除のときbackground-Imageを削除すればよいのでしょうか？

javacript
1  $('.hoge-name').hover(
2    function(){
3      var bglink = $(this).attr("href");
4      $("div.hoge-inner").css("background-image","url("+bglink+")");
5    },
6    function(){
7      $("div.hoge-inner").css("background-image","");
8    },
9    );