html：

<div class="container">
  <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1545633786675&di=1b43ca4fe89c44cc06b026d21f646e91&imgtype=0&src=http%3A%2F%2Fimg.daimg.com%2Fuploads%2Fallimg%2F171221%2F1-1G221000211.jpg" style="" class="image">
  <p class="console"></p>
</div>
 

js:

  //圖片尺寸按蘋果6尺寸大小
  var imgH = 667;
  var imgW = 375;

  var imgDom = $(".image");//獲取圖片
  var winDom = $(window);//獲取視窗
  //使用resize（）
  winDom.resize(function(){
    var winwHeight = winDom.height();//獲取視窗高度
    var winwWidth = winDom.width();//獲取視窗寬度

    var imgHeight = winwHeight*0.5;//圖片的高度是視窗高度的一半
    var imgWidth = imgW/imgH*imgHeight;//圖片的寬度根據圖片的原始寬高比值和視窗高度計算出寬度

    //imgDom.attr("height",imgHeight).attr("width",imgWidth);

    imgDom.css({"height":imgHeight,"width":imgWidth});//給圖片賦計算後的寬高
    

    var imgInfo = "圖片寬："+imgWidth+"圖片高："+imgHeight;
    $(".console").text("視窗寬:"+winwWidth+"視窗高:"+winwHeight  + imgInfo );
  });