The place for more technical questions for those who want to create new pagetypes or bespoke functionality.

jQuery Accordion

  • Neil Pollock
  • Topic Author
  • Offline
  • Premium Member
  • Premium Member
More
9 years 5 months ago #4290 by Neil Pollock
jQuery Accordion was created by Neil Pollock
In the XOT template you have the Accordion Navigator page type, which I believe uses the jQuery accordion widget . There are various jQuery options that can be set when it comes to styling, but for some reason I can't get heightStyle to work.

Essentially, I want the height of each accordion panel to fit the size of the content, rather than filling the whole page. So, this should work:
Code:
$(function() { $(".ui-accordion" ).accordion({ heightStyle: "content" }); });

Unfortunately, it doesn't.

Here is a link so you can see what I mean: xerte.cardiff.ac.uk/play_5135

Page 1 - An accordion I declared myself which works as required
Page 7 - The default settings on Accordion Navigator page
Page 8 - A failed attempt to apply my preferred style to the Accordion Navigator page

Ideally, I would like the accordion on Page 8 to function like the accordion on Page 1 (this is preferable for users who won't want to add an accordion via HTML and would be better adding it through the Xerte interface).

Any ideas?

Please Log in or Create an account to join the conversation.

More
9 years 5 months ago #4291 by tom
Replied by tom on topic jQuery Accordion
The height of the content is also hardcoded so you need to overrule that as well:

This worked for me:
Code:
$(function() { $(".ui-accordion" ).accordion({ heightStyle: "content" }); $(".ui-accordion-content" ).css('height', 'auto'); });
The following user(s) said Thank You: Neil Pollock

Please Log in or Create an account to join the conversation.

More
9 years 5 months ago #4335 by Fay
Replied by Fay on topic jQuery Accordion
I've just added new 'panel height' optional properties to the accordion & tabbed navigator pages that will control this

Please Log in or Create an account to join the conversation.

Moderators: JohnSmith
Time to create page: 0.142 seconds
Copyright © 2026 The Xerte Project.
Xerte logo Apereo logo OSI Logo