0

我在这件事上挣扎了好几个小时。我迫切需要专家的眼睛。

所以，我试图在pageslide 中设置一个Jquery UI Accordion。Pageslide 隐藏到隐藏，然后滑入。pageslide 中的手风琴非常有问题。第一个标题总是折叠起来，我试图用链接定位的标题没有打开。

我向我的好朋友谷歌咨询了一些建议。有很多人有同样的问题。我绝对确定它必须与最初隐藏手风琴的父级有关。

有没有一种方法可以让我在页面幻灯片放映后启动手风琴？

可以在此处找到一个示例 （单击手风琴中的链接以在页面幻灯片中触发第二个手风琴）

最小化问题：

<!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>
4

1 回答 1

1

这是一个jsfiddle 示例，说明您应该如何工作

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);
});
于 2013-07-10T14:33:30.193 回答