2012-06-07 62 views
1

** **解決JQuery的圖標定製和問題與懸停狀態

的Chrome顯然可以有死亡之握赫克於緩存中的文件。殺死該進程,手動清除緩存,並刷新十幾次沒有做任何事情。

更改文件名以強制它下載新的東西確實

去圖。


** **更新

好了,這是一款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主題,而且還有他們的框架內開展工作的方式..

+1

它會幫助,如果你可以發佈一些代碼,所以我們可以得到你想要做什麼的想法。話雖如此,我猜你正在使用某種精靈?你在CSS中檢查了懸停狀態的背景位置是否正確?當你放置一個背景時,你可能會超調,並且當你超出了你的精靈時,最終會出現一個「空白文件」。例如:background-position:-9999px -9999px; –

+0

您是否使用檢查工具檢查Firebug?即使Chrome的檢測也可以讓你玩現場背景。 – Yisela

回答

0

這聽起來可能很明顯,但第一件事,我想當類似的事情發生在我身上的時候是瀏覽器緩存。爲了補救它,我嘗試按Ctrl-刷新,或不同的瀏覽器。我很驚訝它有多頻繁的幫助。我希望你的問題很簡單。 =]

+0

我已經完全關閉了瀏覽器幾次,正如我所提到的按鈕圖標出現在不同的狀態。 – user1441141

+0

你以某種方式幫助了你。我加載了IE 9,以確保它不會與Chrome中的緩存有關。 IE 9顯示正確,但Chrome繼續不這樣做。 – user1441141

+0

這真的很奇怪。使用任務管理器來確保Chrome完全關閉,並將其徹底關閉,直至緩存和歷史記錄被關閉...並且仍然沒有任何結果。但是,更改文件名以強制解決懸停狀態。不知怎的,它對那個緩存有了死亡的控制。 – user1441141