在模态中滚动到活动的手风琴标题

时间:2013-10-15 15:50:55

标签: jquery jquery-ui accordion

快速提问我的问题。

我有一个jquery ui手风琴(.accordion)在一个模态中打开另一个手风琴(.glossWrap)。我正在尝试使用scrollTop将活动的手风琴标题滚动到视图中,但这只是故障或其他内容。

$(".glossary").on("click", function () {
$(".glossWrap").accordion({heightStyle:"content", header:"h3", navigation : true, collapsible:true})
var $accordion = $(".glossWrap"),
panelId = parseInt(window.location.hash.replace(/#panel/, "")) || 0;
var $this = $(this), toOpen = $this.data("panel");
$accordion.accordion("option", "active", toOpen), ( "option", "collapsible", true );
} );

$('.glossary').click(function(){ setTimeout(  function(){
$('#pageslide').animate({
scrollTop: $(".ui-accordion-content-active").offset().top}, 2000);
}, 800) });

我使用setTimeOut在模态打开之前等待。

html:带有链接的手风琴1 .glossWrap手风琴2

    <div class="accordion">
  <h3 id="accordion">accordion 1</h3>
  <div>
    <p><a href="#" data-panel="1" class="glossary">open accordion item in modal</a></p>
  </div>
</div>

Pagelide中的手风琴:

<div id="pageslide">
<div class="glossWrap" >
  <div class="glossIndexWrap">
    <h2>A</h2>
    <h3>glossWrap</h3>
    <!--1-->
    <div>
      <p>open this and scroll into view</p>
    </div>
  </div>
</div>

感谢您的建议! :)

greetz,Will

1 个答案:

答案 0 :(得分:0)

搞定了,我现在知道它与模态中的嵌套div有关。在尝试了几个不同的插件后,我选择了这个插件:http://demos.flesler.com/jquery/scrollTo/

这在我的手风琴中完美无缺!

喝彩!