0

だから、私はJqueryとJavascriptがまったく初めてで、ホバー時に2つの異なる画像を交換する方法を探していました. これまでのところ何も起こりません...だから私の質問は、なぜこのJquery Function Swap Images on hoverしないのかということです。

 jQuery(function(){
     $(".nav-button").hover(
          function(){this.src = this.src.replace("http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png","http://i1256.photobucket.com/albums/ii488/terafanb/guildwars2/26.png");},
          function(){this.src = this.src.replace("http://i1256.photobucket.com/albums/ii488/terafanb/guildwars2/26.png","http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png");
     });
});

これが操作するhtmlです。 

<ul id="nav">
               <li class="nav-button"><img src="http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png" width="225" height="30" alt="" /></li>
               <li class="nav-button"><img src="http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png" width="225" height="30" alt="" /></li>
              <li class="nav-button"><img src="http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png" width="225" height="30" alt="" /></li>
               <li class="nav-button"><img src="http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png" width="225" height="30" alt="" /></li>
               <li class="nav-button"><img src="http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png" width="225" height="31" alt="" /></li>
               <li class="nav-button"><img src="http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png" width="225" height="30" alt="" /></li>
               <li class="nav-button"><img src="http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png" width="225" height="32" alt="" /></li>
               <li class="nav-button"><img src="http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png" width="225" height="30" alt="" /></li>
               <li class="nav-button"><img src="http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png" width="225" height="32" alt="" /></li>
               <li class="nav-button"><img src="http://i1065.photobucket.com/albums/u381/dice027/nyan-cat.png" width="225" height="30" alt="" /></li>
         </ul>

完全な開示ここで関数の設計を取得しましたhttp://www.designchemical.com/blog/index.php/jquery/quick-and-easy-jquery-image-swap/

そして、これは私が機能をテストしているところです http://codepen.io/Austin-Davis/pen/IpDLu

4

2 に答える 2

8

一致する要素".nav-button"は画像ではないためです。したがってthis、プロパティはありませんsrc。

これを使って ：

 $(".nav-button img").hover(
于 2013-01-07T16:16:04.727 に答える
0

あなたはではなくthisを参照しています。を変更するより良い方法は、 メソッドを使用することです。$(".nav-button")$(".nav-button img")src.attr()

于 2013-01-07T16:20:06.320 に答える