Get the accordion style for non-accordion elements

Posted by SK. on Stack Overflow See other posts from Stack Overflow or by SK.
Published on 2010-04-23T10:24:21Z Indexed on 2010/04/23 10:33 UTC
Read the original article Hit count: 508

Filed under:
|

Hi,

I am completely new in jQuery UI's CSS styles so please bear with me.

I have to make a list of contact people.

<div id="accordion">
    <h3><a href="#">George Foo</a></h3>
    <div>
        some information
    </div>
    <h3><a href="#">Michelle Bar</a></h3>
    <div>
        some information
    </div>
    <h3><a href="#">Bill Wind</a></h3>
    <div>
        some information
    </div>
</div>

At first, I thought using the accordion style. However, usage showed me that opening more than one contact might be interesting as well. So I read the note on the bottom of the accordion page to use this instead of accordion:

From page:

jQuery(document).ready(function(){
$('.accordion .head').click(function() {
    $(this).next().toggle('slow');
    return false;
}).next().hide();
});

My problem is that it doesn't look like accordion (smoothness style). I suppose I am not putting the accordion and head class at the right place, but as of now the names look like default links. How can I have the same look for the headers as the accordion effect, without using accordion? I tried searching around but from what I found that specific problem is not much discussed.

Thanks.

© Stack Overflow or respective owner

Related posts about jquery-ui

Related posts about jQuery