javascript - Jquery .fadeToggle() 在一个页面上工作，在另一页面上不起作用(相同的代码)

Question

使用 Jquery (1.7.1) 我正在尝试在 .hover() 上制作图像 .fadeToggle

图像位于页面顶部，上面写着“Concurso de Desfraces....”

代码在此页面上运行:https://tienda.lirainwonderland.es

为什么此页面不起作用？:http://lirainwonderland.es

我能够在 .hover() 上发出警报，因此我确信问题出在 .fadeToggle()

我尝试使用 firebug 来查找此问题的根源，当我在线中断脚本时，“脚本”面板的“堆栈”选项卡上似乎存在差异，但不知道为什么...

这是 JavaScript:

$(document).ready(function () {
 $("#concurso").hover(function () { 
   $('#concurso2').fadeToggle("slow", "linear");            
});
});

这是 CSS:

#concurso {
 position: relative;
}

#concurso2 {
    display: none;
    position: absolute;
    top: -240px;
    left: 0;
}

这是 HTML:

<a id="concurso" href="">
  <img id="concurso1" src="/images/consurso_de_disfraces_carnival_2013_rojo_inico.png" alt="Concurso de Disfraces Lira in Wonderland 2013" />
  <img id="concurso2" src="/images/consurso_de_disfraces_carnival_2013_rosa_inico.png" alt="Concurso de Disfraces Lira in Wonderland 2013" />
</a>

Answer 1

当你刚刚运行代码时，你会看到一个错误

$('#concurso2').fadeToggle("slow", "linear");

尝试在 http://lirainwonderland.es/ 上运行它

这意味着您的 2 个页面上有不同的版本

jQuery.fn.jquery; // checks jQuery version

但这不是问题，看来你的 $() 不是 jQuery，也许你还有其他脚本，如 mootools、prototype 等

您可以使用jQuery代替$，并且当我尝试它时它起作用了。

jQuery('#concurso2').fadeToggle("slow", "linear");