Question

我试图创建一个在悬停时播放GIF的图像。我在这个网站上发现了一些据说可行的jquery，但由于某种原因，它并不适合我。关于为什么的任何想法？

这是html和javascript：

＆＃13;

$(document).ready(function(){


//animate image on hover
    $(document).ready(function()
    {
        $("#imgAnimate").hover(
            function()
            {
                $(this).attr("src", "Videos/Mathew-Demo.gif");
            },
            function()
            {
                $(this).attr("src", "Static shots/Mathew-Demo.png");
            });
    });




});

＆＃13;

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" type="text/css" href="team.css">
  <script src="team.js" type="text/javascript">
  <script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
</head>

<body>
    <img src="Static shots/Mathew-Demo.png" id="imgAnimate">


</body>

</html>

＆＃13;

可能有一个非常简单的原因。

Answer 1

documentReady中有一个documentReady没有用（documentReady等待DOM准备就绪，第二次检查是双倍的）。

此外，您可以直接使用.src属性，从而生成以下代码：

$(document).ready(function()
{
    $("#imgAnimate").hover(
        function(){
            this.src = "Videos/Mathew-Demo.gif";
        },
        function(){
            this.src = "Static shots/Mathew-Demo.png";
        }
    );
});

除此之外，你的代码似乎很好。你确定jQuery被加载了吗？您的代码段不包含它。这是snippet with working example。

Answer 2

您的脚本失败，因为它尝试使用jQuery＆＃34; $＆＃34;在加载jQuery之前。你应该将你的脚本声明移动到你的身体标签的底部，如下所示：

    dataframe
       .GroupBy(x => new { x.State, x.City})
       .Select(x => new {
          x.Key.State,
          x.Key.City,
          Count = x.Count(),
          Sum_Budget = x.Sum(y => y.Budget),
          Sum_Income= x.Sum(y => y.Income)
       }
}).ToArray();

悬停时图像源更改未按预期工作

2 个答案: