Question

所以我使用JQuery创建了这个网页。我使用此代码调整页面上的图像大小，使它们适合方格。

<script type="text/javascript">
  $(document).ready(function(){
    var height = $('.square').width();
    $('.square').css('height', height); 
    window.onresize = function(event) {
      var height = $('.square').width();
      $('.square').css('height', height);
   }
 });
</script>

这完美无缺。当我加载页面或调整浏览器窗口大小时，图像会调整为正方形。问题是当我去按打印页面时（我正在使用谷歌浏览器）。打印机预览会加载页面，就好像这两个脚本不存在一样。所以图像是原始尺寸。

任何想法？

Answer 1

如果你只是想让图像保持平方，你可能甚至不需要javascript，下面给出一个例子，奖励它的响应......

.pic-wrapper { 
  width: 40%;
  float: left;
  margin-right: 20px;
}
.pic { 
  width: 100%; 
  padding-bottom: 100%;
  background-image: url('http://i.imgur.com/uTDpE6J.jpg')  
}

<div class="pic-wrapper">
  <div class="pic">    
  </div>
</div>
<div class="pic-wrapper">
  <div class="pic">    
  </div>
</div>

当我想要打印页面时，javascript会中断

1 个答案: