解決圖片在指定大小盒子內不超出正好填滿的代碼
阿新 • • 發佈:2017-10-14
eight 寬度 blog 超出 script img load() 函數 rip
<script type="text/javascript"> $(".img").each(function(i){ var img = $(this); var realWidth;//真實的寬度 var realHeight;//真實的高度 //這裏做下說明,$("<img/>")這裏是創建一個臨時的img標簽,類似js創建一個new Image()對象! $("<img/>").attr("src", $(img).attr("src")).load(function() { /* 如果要獲取圖片的真實的寬度和高度有三點必須註意 1、需要創建一個image對象:如這裏的$("<img/>") 2、指定圖片的src路徑 3、一定要在圖片加載完成後執行如.load()函數裏執行 */ realWidth = this.width; realHeight = this.height; //如果真實的寬度大於瀏覽器的寬度就按照100%顯示 if(realWidth/realHeight > 282/240){ $(img).css("width","100%").css("height","auto"); }else{ $(img).css("height","100%").css("width","auto"); } }); }); </script>
解決圖片在指定大小盒子內不超出正好填滿的代碼