2

我正在使用 jQuery UI 手风琴,我只是想知道是否可以将其配置为滚动到活动 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/

4

1 回答 1

1

这是我想出的使用scrollTop和 jQuery 手风琴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/

于 2013-10-04T18:35:53.380 回答