Jquery Mobile Events - Need Assistance with Panel and Collabsible Sets -


i have following code trying find out how use events close collapsible sets in panel whenever panel closes. have included example in jffiddle @ following link http://jsfiddle.net/rljbb/4/ included code below. need on understanding how approach use of events using jquery mobile framework. beginning when comes library assistance appreciated.

<body>  <div data-role="page" id="musemain">      <div data-role="panel" id="leftmenupanel">          <div data-role="collapsible-set" data-collapsed="true">             <div  data-role="collapsible" data-theme="b" data-content-theme="d" >                 <h3>overview</h3>                 <p>the overview provides seen on book cover;    name, author , description of story.</p>                 <a href="" data-role="button" data-mini="true" data-icon="edit" data-inline="true" data-theme="a">edit</a>             </div>         <div  data-role="collapsible" data-theme="b" data-content-theme="d" >             <h3>chapters & scenes</h3>             <p>the chapters details of chapters defined , actual storyline scenes created..</p>             <a href="" data-role="button" data-mini="true" data-icon="edit" data-inline="true" data-theme="a">edit</a>         </div>         <div  data-role="collapsible" data-theme="b" data-content-theme="d" >             <h3>characters</h3>             <p>the characters area detailed , allows attributes defined, detailed description, personality type, , relationships.</p>             <a href="" data-role="button" data-mini="true" data-icon="edit" data-inline="true" data-theme="a">edit</a>         </div>       </div>  </div><!-- /panel -->  <div data-role="header">      <a href="#leftmenupanel" id="changeiconvalue" data-role="button" data-icon="bars" data-theme="b" data-inline="true">menu</a>      <h1>muse - writer's assistant</h1>  </div>  <div data-role="content">      <h2>page content</h2>     <p>page content goes here.</p>  </div> <div data-role="footer">     <h1>design intelligentdesigns</h1> </div> 

 </body> 

this solves problem:

$('#leftmenupanel').panel({     close: function( event, ui ) {         $('#leftmenupanel div[data-role="collapsible"]').trigger('collapse');     } }); 

i added updated fiddle: http://jsfiddle.net/rljbb/5/


Comments

Popular posts from this blog

SPSS keyboard combination alters encoding -

Add new record to the table by click on the button in Microsoft Access -

CSS3 Transition to highlight new elements created in JQuery -