0

私はこのサイトで見つけたフィドルを使用しており、達成しようとしていることに対応するように修正しました。ここで、フィドルで動作しています：

http://jsfiddle.net/7pdwP/

HTML 

<div id="fish">test 123</div>

CSS 

#fish{background-image:url(http://testsite.perseocigar.com/menu_nohover.png);width:120px;height:108px;}

JavaScript 

$('#fish').hover(
  function(){$('#fish').css("background-image", "url(http://testsite.perseocigar.com/menu_hover.png)")},
  function(){$('#fish').css("background-image", "url(http://testsite.perseocigar.com/menu_nohover.png)")}
);

しかし、それをウェブサイトで機能させるために、私が推測しているものを見逃しているようです。メインサイトのテストページでやろうとしたことを正確に実行しましたが、まだ機能していません.

http://testsite.perseocigar.com/Untitled-2.htmlは、テスト サイトへのリンクです。

サイトを構築している間、ローカルマシンで動作させようとしましたが、ウェブサーバーで動作しているかどうかを確認しようとしましたが、両方でうまくいきませんでした. どんな援助も素晴らしいでしょう。

4

3 に答える 3

2

私はこの問題を見て、自分で数回経験しました。私が読んだ最良の提案は、メモ帳++を取得して使用して\u8203文字を見つけることです。私はemacsを使用していますが、iso-8859-1エンコーディングで保存しようとすると、文字が指摘されます。

まったく同じコードが Dreamweaver で正常に機能しない

jsFiddle では動作しますが、私のサイトでは動作しません

コードが動作する jsfiddle が Dreamweaver で動作しない

于 2012-07-10T01:48:17.590 に答える
0

開発者ツールを表示してChromeでテストページを実行しましたが、コンソールの下にエラーが表示されます:

Unexpected Token ILLEGAL

行末におかしな文字が入ることがあります。行を削除して、もう一度入力することをお勧めします。

于 2012-07-10T01:44:47.370 に答える
0

中に入れてみましたか？

$(document).ready(function() {
   $('#fish').hover(function() {
      $('#fish').css("background-image", "url(http://testsite.perseocigar.com/menu_hover.png)");
   }, function() {
      $('#fish').css("background-image", "url(http://testsite.perseocigar.com/menu_nohover.png)");
   });
});

複数の要素に同じコードを使用する場合。こんなことしないで

$(document).ready(function() {
    $('#fish').hover(function() {
       $('#fish').css("background-image", "url(images/menu_hover.png)");
    }, function() {
       $('#fish').css("background-image", "url(images/menu_nohover.png)");
    });
});

$(document).ready(function() {
     $('#fish1').hover(function() {
       $('#fish1').css("background-image", "url(images/menu_hover.png)");
     }, function() {
       $('#fish1').css("background-image", "url(images/menu_nohover.png)");
      });
 });

このようにすべてをまとめることができます

$(document).ready(function() {
    $('#fish,#fish2,#fish3,#fish4,#fish5').hover(function() {
       $(this).css("background-image", "url(images/menu_hover.png)");//<-- Then use 'this' to refer to the current element firing the event
    }, function() {
       $(this).css("background-image", "url(images/menu_nohover.png)");
    });
});

または、要素に ex を共有するクラスを与えることをお勧めします。 

<div id="fish" class="fishhover">test 123</div>
<div id="fish1" class="fishhover">test 123</div>
<div id="fish2" class="fishhover">test 123</div>
<div id="fish3" class="fishhover">test 123</div>
<div id="fish4" class="fishhover">test 123</div>

次に、クラスごとに選択します

$(document).ready(function() {
    $('.fishhover').hover(function() {
       $(this).css("background-image", "url(images/menu_hover.png)");//<-- Then use 'this' to refer to the current element firing the event
    }, function() {
       $(this).css("background-image", "url(images/menu_nohover.png)");
    });
});
于 2012-07-10T01:44:48.413 に答える