Question

我现在正在努力工作几个小时。我迫切需要专家的眼光。

所以，我试图在pageslide中设置一个Jquery UI Accordion。 Pageslide被隐藏，隐藏，然后滑入。在页面滑动的手风琴是非常错误的。第一个标题总是折叠，我试图用链接定位的标题不会打开。

我向我的好朋友谷歌征求了一些建议。有很多人有同样的问题。我绝对相信它必须与最初隐藏的手风琴的父母做点什么。

是否有一种方法可以在滑动显示后启动手风琴？

此can be found here的示例（单击手风琴中的链接以在第（1）页内触发第二个手风琴）

最小化问题：

<!doctype html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.js"></script>
</head>
<body>
<div id="ac">
<h3>One</h3>
<div>
Lorem Ipsum Blah Blah Blah
</div>
<h3>Two</h3>
<div>
Lorem Ipsum Blah Blah Blah
</div>
<h3>Three</h3>
<div>
Lorem Ipsum Blah Blah Blah
</div>
</div>
<script>
    $("#ac").accordion();
    $("#ac").hide();
    $("#ac").accordion('activate',2);
    $("#ac").show();
</script>
</body>
</html>

Answer 1

以下是jsfiddle example如何使用

HTML：

<div class="accordion glossWrap">
   <h3>titel</h3>
   <div>
      <p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Maecenas faucibus mollis interdum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.</p>
   </div>
   <h3>titel</h3>
   <div>
      <p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Maecenas faucibus mollis interdum. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur.</p>
   </div>
</div>
<a href="#" class="glossary" data-panel="1">Open me</a>

JS：

var $accordion = $(".glossWrap"),
    panelId = parseInt(window.location.hash.replace(/#panel/, "")) || 0;

$accordion.accordion({
    collapsible: true, 
    active: panelId, 
    heightStyle:"content", 
    header:"h3"   
});

$("a.glossary").on("click", function (e) {
    e.preventDefault();
    var toOpen = $(this).data("panel");
    $accordion.accordion("option", "active", toOpen);
});

隐藏div中的Jquery UI手风琴

1 个答案: