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

我看到了这个问题并亲身经历了几次，我读到的最好的建议是获取并使用 Notepad++ 来定位 \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)");
    });
});

或者甚至更好地给你的元素一个他们共享的类。 

<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 回答