Jump to content

Making First Accordion Active by Default


m_hutchins
 Share

Recommended Posts

First off, I am a newbie.

I'm try to make the first accordion tab and heading tab open by default, but keep coming up short. Any and all help would be greatly appreciated!

Sample url: https://www.iciwireless.com/industry-solutions-mat/construction.htm

So, the "Two-way Radio" accordion and header tab should be open when entering the page.

I'm using a DW template with repeatable regions to populate the accordions on a number of pages, which is working, but need the 1st accordion tab open.

The last code that I tried was the following:

<script>
    $(document).onload(function(){
            $("#accordion1Collapse1").collapse('show');
        });
    });
  </script>

No luck there.

Link to comment
Share on other sites

  • 4 weeks later...

I have tried with this code :

First of all you have to add this reference in link tag :

 <link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
 <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
 <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Now our script is :

<script>     
        $( function() {
            $( "#accordion" ).accordion();
        });
    </script>

And finally out html page is :

<body>            
    <div id="accordion">
      <h3>Section 1</h3>
      <div>
        <p>
        This is section 1.
        </p>
      </div>
      <h3>Section 2</h3>
      <div>
        <p>
        This is section 2.
        </p>
      </div>      
    </div>
</body>

I hope this will help you.😊

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...