如何鼠標懸停此按鈕來打開菜單，而不是點擊

我有這種有點動畫的按鈕，打開一個菜單上點擊，是否有可能鼠標懸停按鈕打開它，而不是點擊？如何鼠標懸停此按鈕來打開菜單，而不是點擊

我不確定它是否與CSS或JavaScript，但這裏的fiddle link與我想鼠標懸停的按鈕。

在此先感謝！

的Javascript

jQuery(document).ready(function($) { 

    var colors = ''; 
    var server_url = ''; 
    var folder_url = 'colors/'; 

    // Style switcher 
    $(".hide-color").show(1000); 
    $('#custumize-style').animate({ 
     left: '-134px' 
    }); 

    $('#custumize-style .switcher').click(function(e) { 
     e.preventDefault(); 
     var div = $('#custumize-style'); 
     if (div.css('left') === '-134px') { 
      $('#custumize-style').animate({ 
       left: '0px' 
      }); 

      // open switcher and add class open 
      $(this).addClass('open'); 
      $(this).removeClass('closed'); 

     } else { 
      $('#custumize-style').animate({ 
       left: '-134px' 
      }); 

      // close switcher and add closed 
      $(this).addClass('closed'); 
      $(this).removeClass('open'); 
     } 
    }) 
});

來源

2016-12-21 Pedro

請看看這個小提琴，如果它的工作原理根據您的要求： https://jsfiddle.net/rawatdeepesh/gtbxpmej/5/ – rawatdeepesh

你要找的.hover（）

離開你.switcher類在你的選擇會給你一些奇怪的行爲，因爲你將在被射擊的懸停孩子你的div內的標籤。刪除該類將觸發父div上的懸停方法（您的菜單滑塊）。上述您的JavaScript這樣會給行爲

13號線：

$('#custumize-style .switcher').hover(function(e) {

嘗試這樣的事情，而不是：

$('#custumize-style').hover(function(e) {

來源

2016-12-21 22:49:29 gbeaven

完美解決了這個問題，謝謝;） – Pedro

如何鼠標懸停此按鈕來打開菜單，而不是點擊

回答

相關問題