點擊後懸停狀態不起作用

所以我有這個頁面https://tricote.net/contact/ 如果您在左側有幾個鏈接，點擊它們，它會啓動您的郵件應用程序，並讓您發送電子郵件到商店。點擊後懸停狀態不起作用

然而，點擊其中一個，之後點擊鏈接懸停在關閉和休息的鏈接狀態將不會在懸停狀態....

又是有什麼辦法可以解決這個問題..？感謝您提前預定時間...！

2016-11-21 Hirohito Yamada

它看起來對點擊功能的JavaScript事件監聽器，它不是一個簡單的懸停的事情。 –

懸停狀態將被關閉，因爲瀏覽器檢測到光標不再懸停在按預期工作的框上。這裏的問題是你有JavaScript代碼，增加了內嵌樣式在箱子上。您必須按照Aliester的指示移除它，以便它可以正常工作。你可以通過運行這個代碼'$（「。contactbox」）來檢查它。each（function（i，e）{$（e））。css（「background」，「」）;}）;'在瀏覽器控制檯中單擊其中一個框以顯示問題。 – josephting

好了，所以這是你的問題代碼：

$(".contactbox").each(function() { 
     var e; 
     return e = this, 
     $(e).on("click", function() { 
      var t, n; 
      return t = $(".contactbox").index(e), 
      $(".contactbox").css("background", "#fff"), 
      $(e).css("background", "#648d85"), 
      n = $(".contactbox").eq(t).data("label"), 
      $("#contact_subject").val(n) 
     }) 
    })

本質上要設置使用HTML元素的「style」屬性，當你用「的CSS」的背景色。這會覆蓋CSS文件中設置的任何內容。我相信這也會覆蓋「懸停」式樣。

所以，你會想改變這些行：

$(".contactbox").css("background", "#fff"), 
$(e).css("background", "#648d85")

你可以創建一個額外的類中指定，而不是使用「的CSS」，即「主動」元素的造型。這可能是這樣的：

$(".contactbox").removeClass("activeElement"); 
$(e).addClass("activeElement");

這樣，您就可以控制通過排序在CSS文件覆蓋什麼，或者提供了「activeElement」類的懸停行爲的額外CSS規則。

EDIT1：好了，所以從您的評論是聽起來像你真的不希望樣式用戶的最後選擇。因此，而不是僅僅刪除這些行：

$(".contactbox").css("background", "#fff"), 
$(e).css("background", "#648d85")

我還以爲你想向用戶表明什麼最後的選擇了。這聽起來像你不希望這樣，你不需要使用「removeClass」 /「addClass」我上面包括線。

希望我理解你想要做什麼。如果這裏沒有列出這些元素的可能狀態。請添加評論或更新您的問題，指出您希望每種狀態組合的樣式。我編號的，所以你可以按編號引用它

當前可能的狀態：

項目中選定/未懸停
項目中選擇/懸停
項目未選中/未懸停
項不可Selected/Hovering

使用此編輯中的建議（State-1 === State-3）和（State-2 ===國家-4）。

來源

2016-11-21 03:09:02 Adrian

謝謝！現在，其他鏈接可以在點擊一個鏈接後關閉懸停狀態。但是，單擊一個鏈接後，即使將鼠標從鏈接中移除，您點擊的相同鏈接也不會關閉懸停狀態。還有其他任何事件會導致此問題發生？ –

@HirohitoYamada我不知道我明白。從您的代碼當前選擇一個項目時，它的背景顏色設置爲與懸停樣式相同的顏色。我以爲你打算用這個來表示活動元素。如果你可以描述你想要什麼樣的風格：「選擇和不盤旋」，「選擇並懸停」，「未選中和不盤旋」以及「未選中和盤旋」，那麼我可以更新我的答案。 – Adrian

對不起，評論混亂。因此，繼承了我在申請建議後留下的問題。 1：你點擊一個，打開郵件應用程序。 2：Cliecked鏈接背景，留在懸停，它不會回到白色背景，不管... –

點擊後懸停狀態不起作用

回答

相關問題