ここから本文です

【Jquery】jqueryを使ってhoverアクションをしたい

dai********さん

2013/8/511:44:22

【Jquery】jqueryを使ってhoverアクションをしたい

1.空の<div>をhtml内において、googleTagManagerでタグを整理しています
HTMLには<div id="c"></div>だけが書かれていることが前提です

2、そしてJSに下記の様に書き、imgを表示しています
<script type="text/javascript">
$(function(){
$('#hoge').html('<a href="a.html"><img src="a.png" alt="花"></a>');
});

3.このa.pngをmouseoverでb.pngに変えたいのですが、どのように書けばいいでしょうか?

<img src="a.png" alt="花" onmouseover="this.src='b.png'">と書くと、エラーになります・・・

初心者で申し訳ないのですが、よろしくお願いいたします。

閲覧数:
224
回答数:
2

違反報告

ベストアンサーに選ばれた回答

mr_********さん

2013/8/512:11:14

><a href="a.html"><img src="a.png" alt="花"></a>
とタグをそのまま書くならjQueryの意味が無い。
DOMオブジェクトを生成し、イベントを付与して挿入しましょう。

https://www.google.co.jp/search?q=jquery+dom%E3%82%AA%E3%83%96%E3%8...
https://www.google.co.jp/search?q=jquery+hover

$(document).ready(function(){
var $link = $("<a />");
var $img =$("<img />").attr("src","b.png");
$img.hover(function(){$(this).attr("src","b.png")},function(){$(this).attr("src","a.png")})
$link.append($img);
$("#hoge").append($link);
});
細部を省くとこんな感じです。

この回答は投票によってベストアンサーに選ばれました!

ベストアンサー以外の回答

1〜1件/1件中

ゆえさんさん

2013/8/512:13:51

jQueryのhover処理と、srcの中身を書き換える処理attr()で書けば問題ないかと思います。

$('#hoge a img').hover(
function () {
$(this).attr('src','b.png');
},
function () {
$(this).attr('src','a.png');
}
);

※hogeの部分を使用しているIDに差し替えてください。

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。

不適切な投稿でないことを報告しました。

閉じる