我在做什麼錯？我試圖使用jQuery點擊一個圖片越來越小

Question

我試圖使圖像更大，當我點擊一個鏈接，但它不會工作。

我在做什麼錯？

JQUERY：

$(document).ready(function(){ 
    $('a, large').click(function(){ 
    $("img").animate({width: "300px"}); 

    }); 

    $('a, small').click(function(){ 
    $("img").animate({width: "75px"}); 
    }); 
}); 

HTML：

<center> 
    <img src="TCRlogo.png"/></br> 
    <a href="#" id="large">Large</a> - <a href="#" id="small">Small</a> 
</center> 

Answer 1

你的選擇是錯誤的。它應該像#id。 請檢查以下代碼片段以獲得更多理解。

$(document).ready(function(){ 
 
    $('a#large').click(function(){ 
 
    $("img").animate({width: "300px"}); 
 

 
    }); 
 

 
    $('a#small').click(function(){ 
 
    $("img").animate({width: "75px"}); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<center> 
 
<img src="https://lh4.ggpht.com/wKrDLLmmxjfRG2-E-k5L5BUuHWpCOe4lWRF7oVs1Gzdn5e5yvr8fj-ORTlBF43U47yI=w300"/></br> 
 
<a href="#" id="large">Large</a> - <a href="#" id="small">Small</a> 
 
</center>

Answer 2

check demo

JQUERY：

$(document).ready(function(){ 
    $('#large').click(function(){ 
    $("img").animate({width: "300px"});  
    }); 

    $('#small').click(function(){ 
     $("img").animate({width: "75px"}); 
    }); 
}); 

HTML：

<center> 
<img src="TCRlogo.png"/></br> 
<a href="#" id="large">Large</a> - <a href="#" id="small">Small</a> 
</center> 

Answer 3

試試這個

$('#large').click(function(){ 
    $(".img1").animate({width: "300px"}); 
}); 

$('#small').click(function(){ 
    $(".img1").animate({width: "70px"}); 
}); 

Answer 4

嘗試以下操作：

$('#small').click(function(){ 
    ... 
    }); 

和

$('#large').click(function(){ 
... 
    }); 

Answer 5

試試這個

$(document).ready(function(){ 
$('#large').click(function(){ 
    $("img").animate({width: "300px"}); 
    }); 
$('#small').click(function(){ 
    $("img").animate({width: "75px"}); 
}); 
});