Jquery手风琴面板打开时移动到顶部

问题描述：

我正在尝试使手风琴面板被点击并打开时它会移动到顶部，以便用户不必向下滚动以查看内容。这是我到目前为止，但我没有尝试似乎工作，当我添加和acitvate功能整个手风琴功能停止工作。任何帮助是极大的赞赏。谢谢。Jquery手风琴面板打开时移动到顶部

$(function() { 

    $(".accordion").accordion({ 
     collapsible: true, 
     active: false, 
     heightStyle: "content", 
     animate: 150, 

      //This makes it possible for multiple panels to be open at the same time 

      beforeActivate: function(event, ui) { 
      // The accordion believes a panel is being opened 
      if (ui.newHeader[0]) { 
       var currHeader = ui.newHeader; 
       var currContent = currHeader.next('.ui-accordion-content'); 
      // The accordion believes a panel is being closed 
      } else { 
       var currHeader = ui.oldHeader; 
       var currContent = currHeader.next('.ui-accordion-content'); 
      } 
      // Since we've changed the default behavior, this detects the actual status 
      var isPanelSelected = currHeader.attr('aria-selected') == 'true'; 

      // Toggle the panel's header 
      currHeader.toggleClass('ui-corner-all',isPanelSelected).toggleClass('accordion-header-active ui-state-active ui-corner-top',!    isPanelSelected).attr('aria-selected',((!isPanelSelected).toString())); 

      // Toggle the panel's icon 
      currHeader.children('.ui-icon').toggleClass('ui-icon-triangle-1-e',isPanelSelected).toggleClass('ui-icon-triangle-1-s',!isPanelSelected); 

      // Toggle the panel's content 
      currContent.toggleClass('accordion-content-active',!isPanelSelected)  
      if (isPanelSelected) { currContent.slideUp(); } else { currContent.slideDown(); } 

      return false; // Cancels the default action 
     } 

});

答

这是我能够做到的，使用多个文章在stackoverflow作为资源。我想出了一个简单的javascript函数，它使用jquery animate滚动到页面上任何元素的顶部。我把它叫做totop（）：

function totop(element) { 
    offset = element.offset(); 
    $("html").animate({scrollTop:offset.top},500); 
}

然后在文档准备函数I定义事件要执行的函数的手风琴一个面板，通过ID一致-1识别的，被点击时：

$("#accord-1").on("accordionactivate",function(event,ui) { 
    totop(ui.newHeader); 
});

这只是我客户想要的方式。我在多个页面上使用它。下面是一个简单的示例页面：

test accordion

Jquery手风琴面板打开时移动到顶部

相关推荐