jQuery更新實際的CSS

首先：我知道jQuery.css（）函數，但它在我的情況下不起作用。我會解釋爲什麼。jQuery更新實際的CSS

我有一個jQuery顏色選擇器被用來改變網站的突出顯示。我想將該顏色選擇器應用於僅在懸停上顯示的元素的邊界。

jQuery.css（）函數僅將CSS應用於找到的元素，並且不適用於:hover CSS屬性。

我試着添加一個CSS類，我切換懸停，但它回到同樣的問題：我試圖改變只有懸停值。

我們有了一個方法可以做到這一點，但我一直在尋找的StackOverflow和谷歌一小時的大部分時間，所以我調用xkcd #627

來源

2014-01-08 Bing

您是否嘗試過使用懸停事件？ http://api.jquery.com/hover/ –

是的，但我在哪裏應用它？如果我將代碼放入updateColor（color）函數（當您更改顏色選擇器時會調用該函數），那麼即使您停止懸停，它也會應用顏色。 – Bing

如果我的回答不能解釋所有內容，請提供顏色選擇器的代碼。 –

使用hover事件來達到同樣的結果。

$('selector').hover(function(){ 
    //A function to execute when the mouse pointer enters the element. 
    $(this).css('property','value'); 
}, function(){ 
    //A function to execute when the mouse pointer leaves the element. 
    $(this).css('property','value'); 
});

來源

2014-01-08 01:50:29

handlerIn/handlerOut給了我一個Javascript的錯誤，但你給我的想法使用.mouseover和.mouseleave來代替，它的工作原理！謝謝！ – Bing

@Bing我刪除了handlerIn/handlerOut修復了錯誤。 $（selector）.hover與$（selector）.mouseenter（handlerIn）.mouseleave（handlerOut）相同;所以你最喜歡哪一個你使用。 –

真棒，感謝偉大的信息（和快速響應）！ – Bing

我加入這個作爲一個備選答案。

如果您需要動態更改您的CSS，那麼您的CSS出現問題。奇怪的是，你需要一個定義，你不能切換一個類，必須動態生成。

假設您有一個小部件可以處於兩種模式：不活動或活動。當它的活動元素應該對懸停事件進行可視化響應時，當它不是時，它們不應該。

<div id="my-widget" class="my-widget-container"> 
    <div class="element">Something to look at</div> 
</div>

CSS

.my-widget-container .element { background-color: #ffffff; } 
.my-widget-container.active .element:hover { background-color: #00ff00; }

您可以通過切換模式：

$("#my-widget").addClass("active");

這將激活:hover線現在出現互動的元素。

如果我更瞭解您的情況，我可以修復一個合適的解決方案。

此外，jQuery.css名爲不好，也許jQuery.style將是一個更好的名字，因爲這正是它的作用。

來源

2014-01-08 02:14:50 Halcyon

問題在於'：hover'上的'background-color'需要通過Javascript顏色選擇器進行動態更改。我仍然有一個很好的機會做錯了，但這就是爲什麼我沒有看到添加一個新的CSS類作爲答案。（順便說一下，這裏是我的顏色選擇器：http://bgrins.github.io/spectrum/） – Bing

jQuery更新實際的CSS

回答

相關問題