我要打印頁面時javascript中斷

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>