按照方式縮放圖像w/jQuery - 瀏覽器緩存

要查看我的問題，請單擊this link。然後點擊this one。注意圖像是如何擠壓的？（你可能必須點擊一個通過尋呼機才能看到它）。按照方式縮放圖像w/jQuery - 瀏覽器緩存

我相信這是因爲瀏覽器緩存。這裏的JavaScript做的工作：

$("#grid_slider").slider({ 
    value: 50, 
    max: 100, 
    min: 10, 
    slide: function(event, ui) { 
     $('ul#grid li').css('font-size',ui.value+"px"); 
    } 
}); 

$("ul#grid li img").each(function() { 
    var width = $(this).width()/125 + "em"; 
    var height = $(this).height()/125 + "em"; 
    $(this).css("width",width); 
    $(this).css("height",height); 
});

我希望你能夠重現這個問題。不知道需要做些什麼來解決這個問題......正在考慮只是將所有功能集中在一起。提前致謝。

來源

2009-06-23 Chaddeus

我已經看到你的網頁，仍然不明白的問題。 – karim79 2009-06-23 23:09:47

「壓扁」是什麼意思？當我加載頁面時，會出現閃爍現象，看到圖像很大，然後縮小。這是你指的是什麼？ – 2009-06-23 23:18:19

我看到您描述的問題。我不認爲它實際上是瀏覽器緩存，但是加載時間...我也在其他一些網站上看到過這個問題，所以我對此形成了（不明通知）的意見。

看來，主要問題是，瀏覽器被要求圖像的尺寸就知道在這之前是什麼...你的腳本火災的$(document).ready，但可能是之前$("ul#grid li img")是滿載的，所以對於一些圖像$("ul#grid li img").width()可能不知道...

也許用這個，而不是看看是否有幫助？（開關$().each爲$().load）

$("ul#grid li img").load(function() { 
    var width = $(this).width()/125 + "em"; 
    var height = $(this).height()/125 + "em"; 
    $(this).css("width",width); 
    $(this).css("height",height); 
})

（完全猜測，雖然...）

附錄：閱讀上的負載功能jQuery的幫助就在剛纔，看來這沒有得到運行事情已經加載的時間，這就是所謂...所以你可能不得不這樣做（呼籲$().each和設置$().load）...

來源

2009-06-24 07:21:08 Stobor

按照方式縮放圖像w/jQuery - 瀏覽器緩存

回答

相關問題