Onclick我應該得到原始大小的圖像

-4

我已經調整了圖像的大小使用CSS，我需要得到的圖像原始大小onclick 我該怎麼做才能做到這一點？Onclick我應該得到原始大小的圖像

<style type="text/css"> 
.pad { 
display:inline-block; 
padding: 5px; 
border: 1px solid #ddd; 
-webkit-box-shadow: 0 0 3px 0 rgba(200, 200, 200, 0.5); 
box-shadow: 0 0 3px 0 rgba(200, 200, 200, 0.5); 
} 
.pin { 
background: #FEFEFE; 
opacity: 1; 
display: inline; 
} 
.pin img { 
width:auto; 
image-rendering:optimizeQuality; 
-ms-interpolation-mode: bicubic; 
max-height: 200px; 
max-width: 400px; 
} 
</style>

來源

2013-08-21 Steam Engine

*「問題要求代碼必須說明問題的一小部分的理解正在解決包括嘗試的解決方案，爲什麼他們沒有工作，和預期結果」 * –

很抱歉，但它是一個有趣的是，這裏最初的兩個評論是「Steam Engine」和「Crazy Train」。您現在可以將其標記爲不具有建設性。 –

http://jsfiddle.net/RDcA7/4/ 您已設置最大高度和最大寬度屬性...將它們刪除，並且您具有原始圖像大小。 jQuery的：

$(".pin img").on('click',function(){ 
    $(this).css({"max-height":"none","max-width":"none"}); 
});

來源

2013-08-21 20:02:58 Daniel

爲什麼downvote？ – Daniel

+1。這符合問題的規範，根本不會改變標記。不知道爲什麼它被低估。 –

@Daniel請幫助我刪除填充點擊..我需要確切的來源img，請更新小提琴。謝謝... –

imgObject.width = imageObject.naturalWidth; 
imgObject.height = imageObject.naturalHeight;

來源

2013-08-21 19:52:16 Delta

的CSS你可以嘗試這樣的： -

var img = document.getElementsByTagName("img")[0]; 
img.onload=function(){ 
    console.log("Width",img.naturalWidth); 
    console.log("Height",img.naturalHeight); 
} 

var img = document.getElementByTagName("img")[0]; 
img.onclick = function(){ 
this.className = ""; 
}

來源

2013-08-21 19:52:52

哪裏是onclick處理 –

@MoazzamKhan： - 增加了!!!! –

已保存downvote：D –

這裏是代碼 -

添加類small到<img>標籤 -

<img class="small" src="http://cssdeck.com/uploads/media/items/2/2v3VhAp.png" />

添加一個onclick聽衆 -

$("img").click(function(){ 
    $(this).removeClass("small") 
})

最後的CSS -

pin img.small { 
    width:auto; 
    image-rendering:optimizeQuality; 
    -ms-interpolation-mode: bicubic; 
    max-height: 200px; 
    max-width: 400px; 
}

這裏是Demo

如果不想使用jQuery然後 -

var img = document.getElementByTagName("img")[0]; 
img.onclick = function(){ 
    this.className = ""; 
}

來源

2013-08-21 19:53:49

downvote的任何理由？ –

Onclick我應該得到原始大小的圖像

回答

相關問題