WordPress.org

Ready to get started?Download WordPress

Forums

jQuery UI Widgets
where do I put the option code? (6 posts)

  1. crj123082
    Member
    Posted 1 year ago #

    Hello,

    I would like to change my accordion instances so they are collapsible...where do I need to change code to do this?

    I've tried adding the following to my theme, in header.php and index.php:

    <script>
    	$(function() {
    		$( ".selector" ).accordion({ active: false });
    		$( ".selector" ).accordion({ collapsible: true });
    		$( ".selector" ).accordion({ autoHeight: false });
    	});
    </script>

    but it doesn't seem to be working.

    Thanks!

    http://wordpress.org/extend/plugins/jquery-ui-widgets/

  2. David Gwyer
    Member
    Plugin Author

    Posted 1 year ago #

    Hi,

    Try this. Just tested it on my local install and works fine. Make sure the '.selector' is correct, i.e. your opening accordion div tag is <div class="selector">

    $( ".selector" ).accordion({
    			collapsible: true
    });

    Add the code in the Plugin settings page in the accordion text box.

  3. crj123082
    Member
    Posted 1 year ago #

    Thanks so much for the help, I got it working!

    One other thing I've noticed, though, is that even if I don't set autoHeight to false (and even if I explicitly set it to true), it does not seem to be adjusting the height accordingly...some sections have a scroll bar, while others have a lot of whitespace. Do you know if there's any way to fix this?

  4. David Gwyer
    Member
    Plugin Author

    Posted 1 year ago #

    I can't think of any reason why the autoheight is doing that. One thing I have learnt about using jQuery UI widgets is that the JS code is easier to get right than the CSS!

    By the way I am working on an updated version to this Plugin which is basically a complete rewrite. It will be much easier to add jQuery code and, will include support for ALL jQuery UI features shipped with WordPress, not just a select few. :)

  5. webreid
    Member
    Posted 1 year ago #

    Hello,

    It seems as though I have it right, but it's not working.

    Any suggestions please?

    [easyrotator]erc_6_1349983050[/easyrotator]

    
    

     

    <div class="selector">

    <div id="accordion-1">
    <p>This is tab one.</p>
    </div>
    <div id="accordion-2">
    <p>This is tab two.</p>
    </div>
    <div id="accordion-3">
    <p>This is tab one.</p>
    </div>
    </div>

    I'm using the collapsible above to crj123082

    It's at http://webreid.com/allodium

    Thank you.

  6. David Gwyer
    Member
    Plugin Author

    Posted 1 year ago #

    Just add valid accordion code and make sure the correct selector is set in Plugin options.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.