JQuery：淡入一個添加類？

我到了必須向社區詢問的地步。我目前有這個網站： http://gyazo.com/e8f8e9884c3d40dee003c2234c840d56 JQuery：淡入一個添加類？

正如你可以在菜單欄中看到的，主頁在它下面有一個邊框。我試圖完成與jQuery是，只要我懸停任何其他菜單項，邊框將慢慢淡入淡出，當鼠標離開它將淡出。

我當前的jQuery代碼：

$("li").mouseenter(function(){ 
     $(this).fadeIn('slow').addClass("current"); 
    }); 
    $("li").mouseleave(function(){ 
     $(this).fadeIn('slow').removeClass("current", 600); 
    });

當前類是添加邊框的類。

任何人都有一些提示？

謝謝！

來源

2015-07-03 LarsBeute

可能重複[使邊框淡入/懸停？]（http://stackoverflow.com/questions/21685421/make-border-fade-in-out-on-hover） –

不，這是使用CSS。我想爲這個函數使用JQuery。 – LarsBeute

然後使用css作爲轉換類，然後用jQuery添加類。仍然是同樣的事情。 '.hover（）'可能是你想要的jquery方法。 –

你也可以使用CSS transitions代替

ul li { 
 
    float: left; 
 
    margin-right: 10px; 
 
    list-style: none; 
 
    border-bottom: 1px solid transparent; 
 
    transition: border-bottom 2s ease; 
 
} 
 
ul li:hover { 
 
    border-color: #aaa; 
 
}

<ul> 
 
    <li>Home</li> 
 
    <li>Contact</li> 
 
</ul>

來源

2015-07-03 18:11:35 Muhammet

-1

你不能將兩個參數中的jquery 'removeClass' 功能。

你可以查看他們關於'removeClass'的文檔。如果要刪除多個類，則必須使用每個className之間的空格將其發送到一個參數中。

如果您想在淡入淡出效果完成後刪除該類，則只需在其回調中調用removeClass函數即可。（參考閱讀淡入的https://api.jquery.com/fadeIn/的文檔）

$("li").mouseenter(function(){ 
var self = this; 
      $(self).fadeIn('slow',function() { 
self.addClass('current'); 
}); 
     }); 
     $("li").mouseleave(function(){ 
      var self = this; 
      $(self).fadeOut('slow',function() { 
self.removeClass('current'); 
}); 
     }); 
     });

，或者如果你想有一定時間後，讓我們假設1000毫秒/ 1秒那麼代碼將是：

$("li").mouseenter(function(){ 
    var self = this; 
       $(self).fadeIn(1000,function() { 
    self.addClass('current'); 
    }); 
      }); 
      $("li").mouseleave(function(){ 
       var self = this; 
       $(self).fadeOut(1000,function() { 
    self.removeClass('current'); 
    }); 
      }); 
      });

的

來源

2015-07-03 18:14:10 SambitD

但該代碼是淡入淡出的整個元素，而不是邊界在反正... –

我沒有給你最終的代碼，所以你會把它，這將執行根據你的情況。因爲你還沒有給出html和css代碼。給我，然後只有我可以給你最終的代碼。我給了你這個想法，以便你可以在你的代碼中應用。 – SambitD

我必須試着向您展示您在jQuery代碼中所犯的主要錯誤。 – SambitD

JQuery：淡入一個添加類？

回答

相關問題