js獲取圖片真實尺寸 - 代碼篇

js獲取圖片真實尺寸 - 代碼篇


代碼案例:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>js獲取圖片真實尺寸</title>
<style type="text/css">
	.thumb{
		width: auto;
		height: auto;
		max-width: 100%;
		height: auto;
	}
</style>
</head>
<body style="max-width: 640px;margin: 0 auto;">
	<div class="">
		<img src="images/news_0_1.png" class="thumb" width="70"/><br />
		<img src="images/news_0_1_A.png" class="thumb"/><br />
		<img src="images/news_0_1_22.png" class="thumb"/>
	</div>

<script src="js/jquery.min.3.1.0.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
	// 圖片地址
	var img_url = 'images/news/news_0_1.png'	
	// 創建對象
	var img = new Image()	
	// 改變圖片的src
	img.src = img_url	
	// 加載完成執行
	img.onload = function(){
	    // 打印
	    alert('width:'+img.width+',height:'+img.height)
	}
</script>
</body>
</html>


以上就是個關於“ js獲取圖片真實尺寸 - 代碼篇 ” 的全部內容。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章