2016-06-25 38 views
0

腳本代碼沒有運行,我需要的圖像頂部和底部的空間上面寬1000倍像素的圖像及以下寬度1000倍像素的圖像,如果條件如何使用實際圖像來改變圖像的大小,如果條件

可以請再取寬度和高度在其他解決我的腳本問題

var yourImg = document.getElementById('yourImgId'); 
 
if(yourImg && yourImg.style > 1000) { /* image actual size above 1000px then set below height and width */ 
 
    yourImg.style.height = '200px'; 
 
    yourImg.style.top = '20px'; 
 
    yourImg.style.bottom = '20px'; 
 
    yourImg.style.width = '200px'; 
 
} 
 
else if (yourImg && yourImg.style < 1000) /* image actual size below 1000px then set below height and width */ 
 
{ 
 
    yourImg.style.height = '200px'; 
 
    yourImg.style.width = '200px'; 
 

 
}
<div style=" border-right:1px solid #fff; "> 
 
<a href="#"> 
 
<img class="img-responsive" alt="product" src="http://olpur.com/admin2/products/15201small.jpg" id="yourImgId" style=" width:100%;border:none; object-fit: contain; object-position: top 75%;" /> 
 
              </a> 
 
</div>

回答

0

代替yourImg.style,我認爲你正在試圖獲得使用圖像的當前寬度0。

var yourImg = document.getElementById('yourImgId'); 

if (yourImg && yourImg.clientWidth > 1000) { 
    yourImg.style.height = '200px'; 
    yourImg.style.top = '20px'; 
    yourImg.style.bottom = '20px'; 
    yourImg.style.width = '200px'; 
} 
else if (yourImg && yourImg.clientWidth < 1000) { 
    yourImg.style.height = '200px'; 
    yourImg.style.width = '200px'; 
} 

https://jsfiddle.net/a35u2fm9/

相關問題