JQuery Hover SlideToggle在SharePoint跳轉和行爲不端

Question

我有一個包含組的SharePoint列表，然後組中的每個元素都有標題和說明。我試圖創建一個jQuery的懸停幻燈片的嵌套集，將揭示該組中的項目，然後描述。我第一次體驗到的行爲是我認爲是頁面內CSS和腳本的結果，但即使只移動了我需要的東西，它仍然具有行爲。有誰知道可能會導致問題的原因是什麼？注意，所有的HTML我都不能編輯，所以對代碼的任何修改都必須通過css或js，因爲sharepoint的工作方式。

https://jsfiddle.net/794qdoxn/

  $(document).ready(function(){ 

       $('.cbq-layout-main li ul').hide(); 

       $('.cbq-layout-main ul li').hover(function() { 
       $(this).find('ul').slideToggle('slow'); 

       }, function() { 
       $(this).find('ul').slideToggle('slow'); 

       }); 

      }); 

      $(document).ready(function(){ 

       $('.dfwp-list div div').hide(); 

       $('.dfwp-list li div').hover(function() { 
       $(this).find('div').slideToggle('slow'); 

       }, function() { 
       $(this).find('div').slideToggle('slow'); 

       }); 

      }); 

Answer 1

您基本上都是堆放的動畫。你可以使用jQueries stop（）函數。

$(function() { 

    $('.cbq-layout-main li ul').hide(); 

    $('.cbq-layout-main ul li').hover(function() { 
     $(this).find('ul').stop().slideToggle('slow'); 
    }, function() { 
     $(this).find('ul').stop().slideToggle('slow');  
    }); 

    $('.dfwp-list div div').hide(); 

    $('.dfwp-list li div').hover(function() { 
     $(this).find('div').stop().slideToggle('slow'); 
    }, function() { 
     $(this).find('div').stop().slideToggle('slow');  
    }); 

}); 

這是jFiddle。