添加和刪除重複的類

-1

我有一個功能，當用戶將鼠標懸停在按鈕上，與BG fadesOut類和懸停類fadesIn。我也希望文本顏色改變，這是在h3類下的按鈕內，但似乎無法觸發事件。添加和刪除重複的類

我試過$（本）.find（ 'H3'）removeClass（ '灰色'）;但沒有運氣！

這裏是我的HTML和jQuery的後臺工作，也許我把它合理地利用家長和孩子們的活動不是要求？

HTML

<div class="cta light-grey-bg"> 
    <h3 class="uppercase grey center"> 
    PHP Anchor link here 
    </h3> 
</div>

jQuery的

$('.cta').hover(function(){ 
    $(this).removeClass('light-grey-bg', 800); 
    $(this).addClass('light-grey-bg-fade', 400); 

}, function(){ 
    $(this).addClass('light-grey-bg', 400); 
    $(this).removeClass('light-grey-bg-fade', 800); 
});

正如我所說的上述工程的功能，但去掉H3級灰度沒有運氣？任何建議都會很棒。

來源

2013-08-01 user2212564

這裏沒有第二個參數：HTTP：//api.jquery。com/addClass/ – Cherniv

@Cherniv不，但看起來像動畫持續時間使用jQuery UI的工作http://jsfiddle.net/T2Q2K/ http://api.jqueryui.com/addClass/ –

這不是第二個參數。那就是如果你傳遞一個函數給它。例如'$（this）.removeClass（function（index，previous）{/ *在這裏你可以使用索引和以前的類名以及設置一個新的* /}）;' –

有一個語法錯誤

$(this).find('h3').removeClass('grey'); //missing .

演示：Fiddle

例：

$('.cta ').hover(function(){ 
    $(this).removeClass('light-grey-bg', 800).addClass('light-grey-bg-fade', 400).find('h3').removeClass('grey'); 

}, function(){ 
    $(this).addClass('light-grey-bg', 400).removeClass('light-grey-bg-fade', 800).find('h3').addClass('grey'); 
});

來源

2013-08-01 13:49:49

哇..唯一一個實際上回答他的問題+1 –

一對夫婦的經驗法則第一：

不要使用空格選擇器，除非你需要t從DOM

下一頁下襬

始終引用您的元素，而不是重新獲取它，你使用removeClass和addClass因爲如果他們有第二個參數，這是他們不這樣做，因爲API文檔clearely狀態：

http://api.jquery.com/removeClass/ http://api.jquery.com/addClass/

注意，第二參數是在jQuery用戶界面，僅用於這意味着持續時間，alonside與其他屬性，類似於jQuery的天然animate函數（你沒有指定你正在使用UI）。 http://api.jqueryui.com/addClass/

但是，您可以添加或移除MROE類，只需用空格分隔它們，就像這樣：現在

$element.addClass('one two three four');

，到您的解決方案：

你選擇你的父母「.cta」，這很好，但是你正在切換那些元素類。您提供的解決方案應該很好地工作......

var $cta = $('.cta'), 
    $h3 = $cta.find('h3'); 

$cta.hover(
    function() { 
     $h3.toggleClass('light-grey-bg light-grey-fade'); 
    }, 
    function() { 
     $h3.toggleClass('light-grey-bg light-grey-fade'); 
    } 
);

看到我重新使用$ CTA和$ H3？這對瀏覽器友好很多。除此之外，你會更安全了，如果你的文檔類是不一致的，仍用add-和removeClass而不是toggleClass。

來源

2013-08-01 13:52:52 ReSpawN

對不起，我已經包含jQuery UI所以持續時間，所以我能夠使用參數。 – user2212564

添加和刪除重複的類

回答

相關問題