在沒有模糊的情況下放大HTML5中的圖像

有沒有辦法讓HTML5中的圖像變大而不會變得模糊。在沒有模糊的情況下放大HTML5中的圖像

例如，該圖像是24×24： enter image description here

如果不是與150的寬度加載它，它變得模糊。 我想pixelated！

相反，我想改變渲染引擎來顯示像什麼，你會在Photoshop中看到。事情是這樣的：

enter image description here

我只在乎現代瀏覽器。

2013-03-28 at.

我提出一個編輯您的帖子與其他圖像展示你想要什麼。希望這會幫助你更好地向人們展示你想要的東西。請告訴我，我對你所要求的解釋是不正確的。 – Michael

謝謝@邁克爾 –

http://stackoverflow.com/questions/388492/firefox-blurs-an-image-when-scaled-through-css-or-inline-style –

經過一番研究：不幸的是，你想要做的是受限於瀏覽器的具體限制。 Firefox有一個有限的實驗代碼(image-rendering)，可以強制瀏覽器停止插值像素，從而導致模糊。

不幸的是，目前沒有其他支持的方式來執行此操作。我的建議是讓你簡單地縮放圖像，就像我在修改原始文章時所做的那樣。

像這樣： enter image description here

2013-03-28 18:54:53 Michael

如果你只是把它留給瀏覽器，他們會盡量使它儘可能流暢（舊的IE版本沒有）。所以你最好的選擇是把它加載到一個畫布上，然後讓（最近鄰居）放大自己。我並不是說這是一個理智的想法，只是把它放在那裏。 :)

那，或有多個版本的圖像，並以某種方式切換它們。有幾種技術可以嘗試，如css推拉門。

2013-03-28 18:52:46 DanMan

回答