如何使用img而不是按鈕激活jQuery功能？

我目前正在使用HTML，CSS和JS編寫一個網站。我使用了在這裏找到的代碼，使兩個圖像在另一個之上淡出，通過單擊按鈕（創建改變img的效果）顯示其他圖像。如何使用img而不是按鈕激活jQuery功能？

但是，我不希望有一個醜陋的<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()功能。

來源

2016-02-27 Harry

如果你想讓jquery在img上運行，那麼使用image id代替input：button。 –

單擊事件也適用於img元素，而不僅僅是按鈕。 –

你沒有發佈完整的HTML，所以我不知道你的img標籤是什麼樣子。但是，假設你已經給了他們一個ID（id="someId"），這樣做：

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

這裏唯一的變化是，而不是聽對您的按鈕點擊，你的代碼現在聆聽您的IMG

點擊

來源

2016-02-27 12:33:41 millerbr

完美，這就是我要找的，謝謝millerbr。 – Harry

沒問題。請記住點擊勾號，以便將來的用戶知道這個答案有效！：D – millerbr

請記住，此功能對於沒有或無法使用鼠標或其他指針設備的用戶無效。 – nnnnnn

如何使用img而不是按鈕激活jQuery功能？

回答

相關問題