Question

我目前正在使用HTML，CSS和JS编写网站代码。我使用了这里找到的代码，使两个图像在彼此之上逐渐淡出，以便在点击按钮时显示另一个图像（创建更改img的效果）。

但是，我不希望页面上有一个丑陋的<input type="button">来激活淡入淡出，相反，我希望能够点击一个图像来调用切换功能。我将如何更改激活该功能的元素？

JS代码：

$(function(){
   $("input:button").click(function(){
      $(".logo").fadeToggle("fast");
   });
});

HTML：

<input type="button" value="Go Kitty Go"/>

CSS：

#logo1 {
  position:absolute;
  top:9px;
  left: 46%;
  height: 29px;
  width: 89px;
}

#logo2 {
  display:none;
  position:absolute;
  top: 8.5px;
  left: 48.2%;
  height: 28px;
  width: 60px;
}

input {
  position:absolute;
  top: 220px;
}

我想将button与img交换以激活fadeToggle()功能。

Answer 1

您尚未发布完整的HTML，因此我不知道您的img代码是什么样的。但假设你给了他们一个id（id="someId"），那就这样做：

$("#someId").click(function(){
    $(".logo").fadeToggle("fast");
}); `});`

这里唯一的变化是，您的代码现在正在侦听您的img上的点击，而不是听取您的按钮上的点击

如何使用img而不是按钮激活jQuery函数？

1 个答案: