i use jquery + jquerui in modx and the accordion. I wan't to have a horizontal menu on the top where I can jump (scroll) to the section (which opens). How would I achieve this. Right now my js looks like this:
/ Accordion
$("#accordion").children("div").each( function() {
var a = $(this).find("a");
var ref = $(a).attr("href");
$(a).attr("href", "#");
$(this).find("div").load(ref);
});
$("#accordion").ajaxStop(function() {
$(this).accordion({
header: "h2",
active: true,
collapsible: true,
clearStyle: true,
navigation: true
});
});
EDIT: my accordion gets build with wayfinder:
[[Wayfinder? &startId=`6` &outerTpl=`outerTpl` &rowTpl=`rowTpl`]]
rowTpl:
<div>
<h2><a href="[[+wf.link]]">[[+wf.title]]</a></h2>
<div>
<!-- placeholder for content -->
</div>
</div>
outerTpl:
<div id="accordion">[[+wf.wrapper]]</div>
The topmenu (horizontal) gets called like this:
[[Wayfinder? &startId=`6` &outerTpl=`QouterTpl` &rowTpl=`QrowTpl`]]
QrowTpl:
<li[[+wf.id]][[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]>[[+wf.linktext]]</a>[[+wf.wrapper]]</li>
QouterTpl
<ul class="arrowunderline">[[+wf.wrapper]]</ul>
Thanks for help
You can use the activate method to programmatically open an accordion panel.
See this fiddle for an example.