CODEWITHSUNDEEP
javascriptjqueryjquery-mobile-collapsible
Steven
Steven

Reputation: 401

Collapsible set Jquery

I have the following collapsible header on my page and currently when you click on the set it expands and collapses. What i want is the javascript to have the set collapse when you click on one of the list items rather than go back to the top to collapse it. Is this possible?

<div data-role="collapsible" class="ui-collapsible-collapsed ui-block-a" id="my-collapsible">

                <h2>
                <a href="#111" class="ui-collapsible-heading-toggle ui-btn ui-btn-up-c" data-corners="false" data-shadow="false" data-wrapperels="span" data-icon="false" data-theme="c">

                </a>
                </h2>
                <div class="ui-collapsible-content ui-body-c ui-collapsible-content-collapsed" aria-hidden="true">
                    <ul data-role="listview" data-theme="g">

                        <li id="topnav4"><a id="tempshellstempb" onclick='changeshellsb();'></a></li>
                        <li id="topnav4"><a id="tempstarstempb"  onclick='changestarsb();' ></a></li>
                        <li id="topnav4"><a id="temppeacocktempb" onclick='changeIt();'></a></li>
                        <li id="topnav4"><a id="tempshootstarsb" onclick='changechestb();'></a></li>
                        <li id="topnav4"><a id="tempbrickstempb" onclick='changerosesb();'></a></li>
                        <li id="topnav4"><a id="tempforresttempb" onclick='changepeacockb();'></a></li>

                    </ul> 

                </div></div>

Upvotes: 0

Views: 247

Answers (1)

Trevor
Trevor

Reputation: 16116

Using jQuery you can trigger a collapse.

$('#tempshellstempb').click(function(){  
  //here you probably want to check to see if your selector is currently collapsed to decide whether your going to collapse or expand.
  // you can probably do this by checking the classes on your selector but i'm not too familiar with how jQuery-mobile handles this
  $( ".selector" ).trigger( "collapse" );
  //$( ".selector" ).trigger( "expand" );
});

Upvotes: 1

Related Questions