图片特效-让图片自适应框的大小
Posted 承载梦想-韩旭明
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了图片特效-让图片自适应框的大小相关的知识，希望对你有一定的参考价值。
——————————————————————————————
<script type="text/javascript">
function init(){
var img = document.getElementById(‘the_img‘);
var width = img.width;
var height = img.height;
var div = img.parentNode;
var w = div.offsetWidth;
var h = div.offsetHeight;
if(width < w && height < h)
return;
if(width/height > w/h){
img.width = w - 20;
img.height = (w-20) * (h-20) / width;
}
}
</script>
——————————————————————————————
<style>
div{width:100px;height:200px;border:1px solid black;margin:10px auto;padding:10px;}
</style>
——————————————————————————
<body style="text-align:center" onload="init();">
<div>
<img src="1.jpg" id="the_img"/>
</div>
</body>
————————————————————————————
以上是关于图片特效-让图片自适应框的大小的主要内容，如果未能解决你的问题，请参考以下文章