jQuery圖標自定義和懸停狀態問題

Question

** 解決了 **

Chrome顯然可以在高速緩存中的文件上造成致命一擊。 終止進程，手動清除緩存以及刷新12次無濟於事。

更改文件名以強制其下載新的文件確實沒有 。

去搞清楚。

---

**更新**

好的，所以這是Chrome唯一的問題。 為了響應清除瀏覽器緩存的建議，我實際上啟動了IE 9，因為它從未加載過該頁面。 那確實顯示圖標處於懸停狀態。

現在我真的很沮喪，因為跨平台問題超出了我的薪水范圍。 這就是為什么我讓JQuery首先為我完成所有繁重的工作！ ：P

---

使用最新的1.8.20 JQuery。

需要一個圖標，以便編輯所有7個主圖標png文件，並在未使用的空間中添加一個圖標。

在css文件中創建具有相關偏移量的新圖標。 除了懸停狀態為空以外，其他所有工作似乎都正常。

通過檢查似乎無法確定懸停狀態正在使用哪個文件，但是CSS文件表示一個png文件，其中顯示了我的自定義圖標。 無論如何，所有內容均已編輯。

關閉瀏覽器並刷新幾次（盡管緩存會使我完全看不到它）。

為什么在懸停狀態下圖標空白？

**回應回應**

沒有代碼，因為正如我已經說過的那樣，它可以在所有其他按鈕狀態下工作。 無論如何，大多數都是在Photoshop中完成的。 這似乎是沒有必要的，因此我對遺漏表示歉意。

.ui-icon-dollar { background-position: -160px -144px; }

那是CSS文件中唯一的額外一行代碼。 其他所有內容均未修改。

/* states and images */
.ui-icon { width: 16px; height: 16px; background-image: url(/images/ui-icons_0078ae_256x240.png); }
.ui-widget-content .ui-icon {background-image: url(/images/ui-icons_0078ae_256x240.png); }
.ui-widget-header .ui-icon {background-image: url(/images/ui-icons_d8e7f3_256x240.png); }
.ui-state-default .ui-icon { background-image: url(/images/ui-icons_e0fdff_256x240.png); }
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(/images/ui-icons_056b93_256x240.png); }
.ui-state-active .ui-icon {background-image: url(/images/ui-icons_f5e175_256x240.png); }
.ui-state-highlight .ui-icon {background-image: url(/images/ui-icons_f7a50d_256x240.png); }
.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(/images/ui-icons_fcd113_256x240.png); }

這些是來自JQuery Themeroller的原始CSS行。 所有主圖標文件均相同（顏色除外），並且未為圖標定義多個偏移量。 我添加的那一行代碼通常定義了一個圖標。

由於它在其他狀態下正確顯示，因此我只能假設偏移量是正確的。

現在，對於Chrome中的檢查工具而言，它在懸停狀態下對span元素沒有任何區別。 該背景圖像保持不變。

我不知道您可以使用Chrome實時對其進行編輯！ ：） 感謝那。

在懸停狀態下，實時更改背景圖像對按鈕本身沒有影響。 它仍然是空白。

當然，我會經歷所有這一切，因為制作自己的圖標既好又花哨，但是您不能使用.button來定義任何按鈕和回調，而不僅限於這些主圖標文件中的內容。 一次調用一次即可激活按鈕的所有不同狀態，定義標簽和回調，這非常有用。 編寫更少的代碼以及所有這些:)

必須有一種方法可以將按鈕圖標添加到JQuery主題，並且仍然使它們在框架中工作。

Answer 1

這聽起來似乎很明顯，但是當我遇到類似的事情時，我想到的第一件事就是瀏覽器緩存。 為了解決這個問題，我嘗試使用ctrl-refresh或其他瀏覽器。 令我驚訝的是，它經常能幫上忙。 希望您的問題很簡單。 =]