鏈接背景圖像在加載之間消失

Question

#nav ul li a.jobs_mn { 
    background: url(../images/jobup.png) #2d333e no-repeat 7% 50%; 
} 

#nav ul li a.jobs_mn:hover { 
    background: url(../images/jobover.png) #fff no-repeat 7% 50%; 
} 

然後我將類jobs_mn添加到鏈接。當我點擊鏈接時，圖像消失，直到加載下一頁。它正在加載一個PHP查詢actualy：

<a href="?news=1" class="jobs_mn">bla bla</a> 

任何想法如何解決這個惱人的事情？

Answer 1

你的問題在於你正在改變:hover狀態的背景。由於狀態在:hover變爲:click時發生變化，用戶通常會從鏈接中將鼠標移出，因此需要確保顯示的是同一圖像。

該鏈接基本上有4個狀態：之前（未點擊），懸停，活動，之後/點擊。

添加相同background: url../images/jobover.png) #fff no-repeat 7% 50%到你希望它是存在於每個國家。如果你想在點擊鏈接後，此相同的圖像是存在，它會是什麼樣子：

#nav ul li a.jobs_mn:hover:after { 
background: url(../images/jobover.png) #fff no-repeat 7% 50%; } 

雖然這是一個有點冗餘，而且我還沒有真正遇到這種情況，這應該提供了一種故障安全機制，在用戶單擊並在查詢處理過程中將鼠標移開後保持圖像不變。