手機端 圖片自適應屏幕尺寸


    <script type="text/javascript">
        $(function () {
            var imglist = document.getElementsByTagName("img");
            //安卓4.0+等高版本不支持window.screen.width,安卓2.3.3系統支持
            var _width;
            doDraw();

            window.onresize = function () {
                //捕捉屏幕窗口變化,始終保證圖片根據屏幕寬度合理顯示
                doDraw();
            }

            function doDraw() {
                _width = window.innerWidth;
                for (var i = 0, len = imglist.length; i < len; i++) {
                    DrawImage(imglist[i], _width);
                }
            }

            function DrawImage(ImgD, _width) {
                var image = new Image();
                image.src = ImgD.src;
                image.onload = function () {
                    //限制,只對寬高都大於30的圖片做顯示處理
                    if (image.width > 30 && image.height > 30) {
                        if (image.width > _width) {
                            ImgD.width = _width;
                            ImgD.height = (image.height * _width) / image.width;
                        } else {
                            ImgD.width = image.width;
                            ImgD.height = image.height;
                        }

                    }
                }

            }

        })
</script>

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM