CSS expression控制圖片自動(dòng)縮放效果代碼[兼容 IE,Firefox]
更新時(shí)間：2008年09月02日 00:29:33 作者：
一直以來(lái)有個(gè)很頭疼的問(wèn)題困擾著我，那就是圖片縮放的問(wèn)題，寫到 JS 里面吧，不太容易修改。寫到 CSS 里面吧，IE 6 又不支持 max-width
今天用了很久時(shí)間終于解決了這個(gè)問(wèn)題，基本完美了，唯一不完美的就是 IE 6 只有在圖片完全下載完成后才會(huì)自動(dòng)調(diào)整大小，不過(guò)聊勝于無(wú)，總比進(jìn)入頁(yè)面后看到長(zhǎng)長(zhǎng)的橫向滾動(dòng)條舒服的多，這里使用了 expression，但是利用了一次加載，所以 expression 不會(huì)造成內(nèi)存泄漏。當(dāng)然，如果你有更好的解決方案，希望能與我交流。
代碼如下：
.Image { max-width:600px;height:auto;cursor:pointer; border:1px dashed #4E6973;padding: 3px; zoom:expression( function(elm) { if (elm.width>560) { var oldVW = elm.width; elm.width=560; elm.height = elm.height*(560 /oldVW); } elm.style.zoom = '1'; }(this)); }
代碼如下：
.Image { max-width:600px;height:auto;cursor:pointer; border:1px dashed #4E6973;padding: 3px; zoom:expression( function(elm) { if (elm.width>560) { var oldVW = elm.width; elm.width=560; elm.height = elm.height*(560 /oldVW); } elm.style.zoom = '1'; }(this)); }
相關(guān)文章
div+CSS網(wǎng)頁(yè)布局的意義與副作用原因小結(jié)
隨著WEB2.0標(biāo)準(zhǔn)化設(shè)計(jì)理念的普及，國(guó)內(nèi)很多大型門戶網(wǎng)站已經(jīng)紛紛采用DIV+CSS制作方法，從實(shí)際應(yīng)用情況來(lái)看，此種方法絕對(duì)好于表格制作頁(yè)面的方法。2008-09-09
html下利用javascript連數(shù)據(jù)庫(kù)
html下利用javascript操作本地?cái)?shù)據(jù)庫(kù)的代碼2008-02-02
IE8 Beta1已出，其中我們能看到很多的新特性，如layout引擎將“完全”支持CSS2.1和HTML 5，所以和之前IE瀏覽器所使用的Layout引擎并不相同，之前的IE瀏覽器并不完全符合互聯(lián)網(wǎng)標(biāo)準(zhǔn)。2008-06-06
在制作網(wǎng)頁(yè)中，我們經(jīng)常需要用到下面的css，有朋友整理好的特給大家，大家可以看看，一定要記住2008-08-08
層自動(dòng)適應(yīng)高度...2006-11-11
超贊的隨機(jī)顏色搭配工具...2007-05-05
CSS對(duì)Web頁(yè)面載入效率的影響分析總結(jié)
我們都熟知JavaScript可能會(huì)對(duì)Web頁(yè)面的加載與顯示產(chǎn)生較大的影響，因此我們常常關(guān)注JavaScript是不是會(huì)占用客戶端較多的資源，然而大部分都會(huì)忽略的一件有趣的事情，CSS也會(huì)對(duì)Web頁(yè)面載入的效率產(chǎn)生影響。2008-05-05
CSS3實(shí)現(xiàn)動(dòng)態(tài)翻牌效果 仿百度貼吧3D翻牌一次動(dòng)畫特效
本文主要分享一個(gè)利用CSS3新特性transform，實(shí)現(xiàn)3D翻牌的特效，有需要的小伙伴可以參考下。2016-05-05
前端html+css實(shí)現(xiàn)動(dòng)態(tài)生日快樂(lè)代碼
?生日送什么禮物總是要花一番心思，別出心裁不落俗套，什么禮物才能讓那一個(gè)她開(kāi)心呢？來(lái)看看前端大大用html+css實(shí)現(xiàn)動(dòng)態(tài)生日快樂(lè)代碼吧，親測(cè)可用。2023-01-01
使用純CSS實(shí)現(xiàn)未知尺寸的圖片(但高寬都小于200px)在200px的正方形容器中水平和垂直居中2008-05-05