2013-03-21 66 views
7

我有一個HTML頁面,其中包含1675px×2640px的圖像。我嘗試在iPad中查看它,顯然移動Safari會降低圖片的樣本。我們想要顯示高質量的圖像,但Safari限制了這一點。移動Safari瀏覽器下采樣大圖像。如何保留?

我一直在尋找解決方案來保留圖片大小。我一直在iPad 3上使用移動Safari進行查看。人們建議使用其他瀏覽器,但默認情況下我們正在使用移動Safari。

是否有任何CSS,JavaScript或其他解決方案限制?

+0

你能告訴我們你的html頁面的鏈接嗎? – kyooriouskoala 2013-03-21 07:56:11

回答

3

我相信你只是喜歡這個答案,但簡短的答案似乎是:「你不會得到1:1的大尺寸圖像」。

稍微長一點的答案是,蘋果有意強迫這些東西以這種方式工作,因爲之前它的工作方式只是不加載圖像或崩潰。現在

,爲更全面的答案與引文...

Apple's Known Resoruces Limits

的事情是,當圖像被解碼/解壓縮它佔用了大量的整個赫克比的圖像更多的內存空間文件大小。其計算公式蘋果指出的是,與512MB的RAM器件,像你提到的iPad 3的,將拒絕超過5百萬像素,從而導致非JPEG圖像:

height * width <= 5 * 1024*1024 

對於JPEG,蘋果公司指出,他們將進行二次採樣,以便您要查看JPEG文件:

JPEG的最大解碼圖像尺寸是使用子採樣的32百萬像素。 由於二次採樣,JPEG圖像可以達到3200萬像素,這允許JPEG圖像解碼爲具有十六分之一像素數量的大小。對大於2百萬像素的JPEG圖像進行二次採樣 - 即將其解碼爲縮小尺寸。 JPEG子採樣允許用戶查看最新數碼相機的圖像。

請注意,它規定2百萬像素是全尺寸查看JPEG的限制,即2 * 1024 * 1024。由於您的圖像大概超過4百萬像素,因此它將在iPad 3上進行二次採樣。並且,如果不使用外部程序,則無法強制執行任何操作。

要使用外部程序的最小的改善,看到這個鏈接,當一個人建議GOODREADER:Apple Forum, Seeking Full Image Resolution in MiniSfari

這裏是另一個#1具有類似問題/答案對:Image Size Limitations in Mobile Safari

1

享受iPad上的Retina視網膜功能和iPhone 4/5的使用增加了一倍大小的圖片如下:

<img src="test.jpg" width="837" height="1320" /> 

注意尺寸減小一半,但test.jpg放在不要求調整。

或者,也可以準備另一組的高分辨率圖形,並且當檢測到視網膜畫面時顯示它,使用媒體查詢(Modernizr的)

像素密度理論值: Retina屏幕把2個像素爲1個像素,例如與320px寬度,它實際上包含640px內容。在這裏閱讀更多信息:http://www.sitepoint.com/css-techniques-for-retina-displays/

3

Mobile Safari does not downsample progressive JPEGs.假設JPEG是一種可接受的格式爲您的目的,只需將其轉換爲漸進式編碼。假設您有一個現有的非漸進式JPEG圖像,您可以使用諸如jpegtran之類的工具將編碼無損地轉換爲逐行掃描。

+0

但是,如果圖像非常大 - 它會導致加載錯誤。 對於方面寬度/高度= 1.5我得到下一個值: 最大加載的漸進式JPEG - 2804x1869, 最大加載的基線JPEG無下采樣 - 1774x1182, 最大加載基線JPEG與下采樣 - 10816x7210(向下取樣,以1352x746)。 值得iPhone 3GS與256 RAM。 iOS 5.1.1。 – Enyby 2013-09-08 11:11:54

+0

@Enyby - 任何瀏覽器都有內存限制。即使是桌面級瀏覽器也可能會在加載大量圖像時出現內存不足的情況。在這個時代,256MB並不是很多。 – Unsigned 2013-10-08 17:18:43

相關問題