http://www.daqian163.com/web/461.html
在制作手機網站的時候，常常需要圖片自適應手機等移動終端設備屏幕大小，實現圖片自適應屏幕大小的方式可以有多種，這里青島網站制作說一下自己所使用的js實現方法。
這里，用到了jQuery這個js框架，所以在head中需導入jQuery。比如大千手機網站的代碼為：
<script src="/mobile/js/jquery.min.js" type="text/javascript"></script>
引用完jQuery后，需要設置當圖片的寬度大於多少時，就設置所要自適應屏幕大小的圖片的寬度為100%，高度為100%。
代碼如下：
<script type="text/javascript">// <![CDATA[
$(document).ready(function()
{
$("#maincontent img").attr("width","100%");
$("#maincontent img").attr("height","100%");
});
// ]]>
</script>
由於我控制的只是主內容部分的div中的圖片，所以需要用jQuery獲取div的id為maincontent的div，$(“#maincontent img”)的意思是獲取此div中的所有img，然后設置其寬度為100%，高度為100%，這樣所有主要內容部分的img圖片都是自適應屏幕大小的。
或者你也可以設置圖片寬度、高度為固定的值的大小，但是那樣你設置完圖片寬度大小后，還得根據現圖片寬度計算同比例縮小圖片后的高度，那樣麻煩許多，就懶得弄了，干脆全部都設置成100%，這樣也沒什么不妥的。
比如大千手機站的這個頁面：http://m.daqian163.com/productsdetail.php?id=231&cat=6，當用谷歌瀏覽器模仿iPhone 6手機訪問頁面時，所顯示大自適應手機屏幕效果：
當然，實現圖片自適應屏幕大小的方式還有其它方法，只是青島網站建設覺得這個js非常的好用。