title: how to make accordion headers all collapsed initially on page load?
body: <pre><code>I added this script on my page..it didnt work
  
      &lt;script type="text/javascript"&gt;
      $(document).ready(function(){
        $("#accordion").accordion( { active: false, collapsible: true });
      });
  </code></pre>
  
  <p><strong>my accordion</strong></p>
  
  <pre><code>&lt;cc1:Accordion ID="Accordion1" runat="server" FadeTransitions="true"  Visible="true" AutoSize="None"SelectedIndex="0" RequireOpenedPane="false"  TransitionDuration="250" 
  HeaderCssClass="accordionHeader toggler" ContentCssClass="accordionContent expanded toggler"&gt;
                  &lt;HeaderTemplate&gt;
  
                      &lt;b style="color: Black"&gt;
  
                          &lt;%#Eval("Ques")%&gt;
                      &lt;/b&gt;
  
                  &lt;/HeaderTemplate&gt;
  
  
                  &lt;ContentTemplate&gt;
                  &lt;p&gt; &lt;%#DataBinder.Eval(Container.DataItem, "QuesAns")%&gt;&lt;/p&gt;
  
                  &lt;/ContentTemplate&gt;
              &lt;/cc1:Accordion&gt;
  </code></pre>
  
  <p><strong>I see the first header expanded when page's loaded. How to make them all collapsed on page load?</strong></p>