javascript - jquery mouseup 无法正常工作

Question

http://igt.bitballoon.com/

上面是引用网站，我正在使用一些 jquery 函数，但我不知道为什么 mouseup 不起作用。

这是位于头部内部的 jquery，是的，我也在那里引用了 jquery

$(document).ready(function()
{
    $("#Clickables").mouseup(function() 
    {
        $(this).css({"background":'url("http://igt.bitballoon.com/images/clickani.png") no-repeat center', "background-size":"75% 75%"});
    });

    $("#Clickables").mouseout(function() 
    {
        $(this).css({"background":'url("http://igt.bitballoon.com/images/clickani.png") no-repeat center', "background-size":"75% 75%"});
    });

    $("#Clickables").mousedown(function()
    {
        $(this).css({"background":'url("http://igt.bitballoon.com/images/clickdown.png") no-repeat center', "background-size":"75% 75%"});
    });
});

这是相关的 html

<div id="Clickables" class="blockclicker" onclick="GatherMoney();">
</div>

我想要发生的事情:当单击图像时，我希望只要鼠标按下，它就会发生变化，并在用户放开或离开该区域时变回原始状态。 mousedown 和 mouseout 事件工作正常。这是没有意义的，因为当我创建 mouseout 事件时，我只是复制并粘贴 mouseup 事件并更改了该事件。问题是什么: mouseup 事件不会放回具有其属性的原始图像，我相信它是正确的图像，但不重复中心和大小不适用，但它们适用于 mouseout 功能。

我很困惑

Answer 1

你能试试这个吗？我已经尝试过here

$(document).ready(function()
{
    $("#Clickables").mouseup(function() 
    {
        $(this).css({"background":'url("http://igt.bitballoon.com/images/clickani.png") no-repeat center', "background-size":"75% 75%"});
    });

    $("#Clickables").mouseout(function() 
    {
        $(this).css({"background":'url("http://igt.bitballoon.com/images/clickani.png") no-repeat center', "background-size":"75% 75%"});
    });

    $("#Clickables").mousedown(function()
    {
        $(this).css({"background":'url("http://igt.bitballoon.com/images/clickdown.png") no-repeat center', "background-size":"75% 75%"});
    });
});

<div id="Clickables" class="blockclicker" style="height:200px; width:200px;" onclick="GatherMoney();">
  <button>click here</button>
</div>