2013-01-31 38 views
0

我有一個圖像,我用作加載動畫是755px寬。css推拉門技術的動畫加載欄

http://www.salts-studios.com/resources/working_large.gif

的事情是我在一個應用程序我開發了圖像寬度必須是流體的一個部分的要求。我知道,IE 8是主要支持的瀏覽器(因爲我知道),因此在需要時縮放圖像並不是一個選項。

我不能改變圖像,但我可以創建一個新的額外的一個,只要它看起來與原始樣式相同。

任何人都可以推薦任何技術來獲得完全流暢的寬度嗎?

我試過各種推拉門技術,但它們因爲圖像是動畫而落下。

在此先感謝。

回答

1

有一個相當簡單的解決方案。在父div中,將其設置爲width: 100%,並將子圖像也設置爲width: 100%。這裏有一個例子:

.bar { 
    width: 100%; 
} 

.bar img { 
    width: 100%; 
    height: 19px; 
} 

這裏還有一個JSBin that has a working example

拖動瀏覽器窗口中不同大小和觀看圖像的寬度調整大小。讓我知道如果這是你所想的應該發生。

+0

這實際上看起來像它會做的伎倆!這似乎是我試圖過度設計它。 – lunchboxbill

+0

我們以前都在過度工程船。很高興幫助。 –