如何為此Javascript代碼設置背景圖片的寬度？

Question

克里斯·安東內利斯 （Chris Antonellis）的freezegframe.js插件使您基本上可以在鼠標懸停時啟動動畫gif。 它也有一些不錯的東西，例如動畫中的淡入淡出。 這是插入該插件所需的語法：您已設置

<script type="text/javascript" src="freezeframe.js"></script>
<script type="text/javascript">
freezeframe = new FreezeFrame();
</script>

在您的頭文件中，然后簡單地：

<img src="img/mr_div_retro_sphere.gif" freezeframe />

在您的HTML正文中。 然后可以使用以下樣式設置圖像的樣式

figure.freezeframe-container {
    border-radius: 3px;
    border-top: 1px solid __border__;
    border-left: 1px solid __border__;
    width: 100%;
    margin: 0 auto;
    -moz-box-shadow: 5px 5px 3px #888;
    -webkit-box-shadow: 5px 5px 3px #888;
    box-shadow: 5px 5px 3px #888;
}

如文檔中所示（請參閱原始鏈接）。 問題在於，目前尚無法對背景圖片進行樣式設置。 請參閱此處的測試示例。

從測試中可以看到，背景圖像使用原始gif調整大小。 但是，由於我希望該站點在調整大小時具有彈性，因此我需要一種方法來調整初始圖像的大小。

我已經聯系了作者，但是他解釋說，困難在於當前代碼占用圖像的第一幀-似乎不清楚如何在其上附加CSS樣式命令。

Answer 1

這很奇怪，但是讓它看起來不錯的一種怪誕方法是：

.freezeframe-container { background-repeat: no-repeat; background-size: 78%; }

但看起來初始背景圖像與動畫gif不太匹配。

希望能有所幫助。