jQuery.lazyload使用打印

試圖讓jquery.lazyload用於打印和打印介質查詢。它在Chromium中幾乎是一種作品。但是，它只會顯示在「屏幕」上，而不是「打印」輸出中。不知道這是由於lazyload的異步性質還是我的濫用。jQuery.lazyload使用打印

這裏是我到目前爲止有：

$(document).ready(function() { 
    if (Modernizr.mq('only all')) { // check of mq support 
     print_mq = window.matchMedia('print') 
     print_mq.addListener(function(mql) { 
      if (mql.matches) { 
       $("img.lazy").trigger('appear'); // load lazy loaded imags before print 
      } 
     }); 
    } else { 
     window.onbeforeprint = function() { 
      $("img.lazy").trigger('appear'); 
     } 
    } 
});

我只找到.trigger('appear')通過源挖後。它可以在鉻的開發工具或螢火蟲中運行。但是，在這種情況下運行似乎有所不同，我無法弄清楚原因。

我很感激任何猜測如何讓這個工作的打印機媒體。

來源

2013-02-28 Mike Shultz

要小心，在第3行中，您正在定義一個全局變量。 – Seb 2016-06-23 09:01:14

我發現使用觸發器只會導致部分圖像加載，特別是在使用轉換時，所以我試圖直接修改已經取得一些成功的圖像。

該解決方案非常適用於IE和鉻，但仍然有Mozilla Firefox瀏覽器一些時間問題這似乎並不喜歡加載的內容按下打印按鈕後（阻止？），雖然會允許內容被改變/注入到頁面中，並且在圖像已經加載之後將在第二次打印請求上顯示圖像，傷心地擊敗目的。 Opera仍然是一個失敗的原因，因爲它目前不支持這兩個事件的打印目的，也許當他們轉換爲webkit？

嘗試改變：

$("img.lazy").trigger('appear');

到

$("img.lazy").each(function(){ 
    $(this).attr('src',$(this).attr('original')); 
});

它仍然不是一個完美的解決方案，但它是在正確方向上的步驟中，至少使用兩種IE或鉻的〜60％。

注意：您也可以直接在加載時使用此代碼，因爲它通過將圖像推遲到頁面的其餘部分加載後仍可加速初始渲染時間，當然它不會節省帶寬在lazyload插件中使用的滾動方法。

來源

2013-04-13 18:54:10 Shaun

jQuery.lazyload使用打印

回答

相關問題