jQuery UI Accordion 滚动到事件部分

Question

我正在使用 jQuery UI Accordion ，我只是想知道是否可以将其配置为滚动到事件 div 的开头 - 因为我正在使用它处理相当多的内容，并且在他们打开的那一刻，但用户必须向上滚动才能看到内容。

<div class="accordion">
    <h3>Section Title</h3>
    <div>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean consectetur ipsum vel nibh iaculis, sit amet euismod felis tincidunt. Donec pretium pulvinar condimentum. Donec sit amet placerat turpis. Sed vel lacus lectus. Suspendisse sodales odio eu libero eleifend porta. Pellentesque auctor, orci ut rhoncus ornare, felis sem lacinia arcu, in pellentesque sapien lorem faucibus metus. Mauris felis metus, convallis sed volutpat eu, posuere non elit. Fusce consequat ipsum turpis, ac convallis nisi ultricies eu. Phasellus vehicula justo augue, et pellentesque odio porta at. Phasellus tincidunt vitae velit in pellentesque. Ut venenatis blandit quam, at gravida erat ullamcorper at. Sed varius eleifend ligula et eleifend. Sed tristique tortor ipsum, eu laoreet nunc euismod in. Phasellus egestas nibh non semper condimentum. Praesent pellentesque leo et turpis fermentum, vitae eleifend velit rutrum. Quisque et nunc at odio accumsan sodales.</p>
        <p>Aliquam enim enim, rhoncus sed malesuada at, interdum pulvinar massa. Vestibulum eget felis diam. Nunc gravida massa quam, in suscipit diam congue ut. Pellentesque quis nunc vitae lectus adipiscing porttitor. Phasellus eget iaculis enim. Nulla sed augue pretium, tempus ipsum ut, sodales metus. Donec faucibus varius neque vitae gravida.</p>
    </div>
    <h3>Section Title 2</h3>
    <div>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean consectetur ipsum vel nibh iaculis, sit amet euismod felis tincidunt. Donec pretium pulvinar condimentum. Donec sit amet placerat turpis. Sed vel lacus lectus. Suspendisse sodales odio eu libero eleifend porta. Pellentesque auctor, orci ut rhoncus ornare, felis sem lacinia arcu, in pellentesque sapien lorem faucibus metus. Mauris felis metus, convallis sed volutpat eu, posuere non elit. Fusce consequat ipsum turpis, ac convallis nisi ultricies eu. Phasellus vehicula justo augue, et pellentesque odio porta at. Phasellus tincidunt vitae velit in pellentesque. Ut venenatis blandit quam, at gravida erat ullamcorper at. Sed varius eleifend ligula et eleifend. Sed tristique tortor ipsum, eu laoreet nunc euismod in. Phasellus egestas nibh non semper condimentum. Praesent pellentesque leo et turpis fermentum, vitae eleifend velit rutrum. Quisque et nunc at odio accumsan sodales.</p>
        <p>Aliquam enim enim, rhoncus sed malesuada at, interdum pulvinar massa. Vestibulum eget felis diam. Nunc gravida massa quam, in suscipit diam congue ut. Pellentesque quis nunc vitae lectus adipiscing porttitor. Phasellus eget iaculis enim. Nulla sed augue pretium, tempus ipsum ut, sodales metus. Donec faucibus varius neque vitae gravida.</p>
    </div>
</div>

http://jsfiddle.net/nQgXC/2/

Answer 1

这是我使用 scrollTop 和 jQuery Accordion activate 事件想出的东西。

$(function() {
   $( ".accordion" ).accordion({
      activate: function(event, ui){
           var scrollTimer = (Math.abs(($('body').scrollTop()-ui.newPanel.offset().top-45)/100));
           $('html, body').animate({
              scrollTop: ui.newPanel.offset().top-45
           }, scrollTimer*400);
      }
  });
});

http://jsfiddle.net/nQgXC/7/