Site logo

Archived topic

Click button & open accordion

0 replies · Started by melvin on July 8, 2021

Viewing posts 1–1 of 1

Hi,

I've implemented accordion successfully with this guide

Now I would want to achive on click of the floating button, it will lead to same page's accordion number 6, and the accordion number 6 will open. like below
https://imgur.com/a/l7uZWn8

This is my test page

CSS

/*accordion styling*/
.accordion-container {
    display: none;
}

.accordion-container.toggle-open {
    display: block;
}

.accordion-toggle {
  cursor: pointer;
	margin: 0px;
	display: block !important;
}

.accordion-toggle:after {
    content: '\002B';
    color: darkgray;
    font-weight: bold;
    float: right;
	  margin-right: 20px;
	font-weight: 800;
	font-size: 1.4em;
}

.accordion-toggle.toggle-open:after {
    content: "\2212";
	     color: #4D774E;
}

Hook Element Javascript

<script type="text/javascript">
  jQuery(document).ready(function($) {
    $('.accordion-toggle').click(function(){

      //Expand or collapse this panel
      $(this).next().slideToggle('fast');
      
			 //Switch toggle
      $(this).toggleClass('toggle-open');
    });
  });
</script>

Could you kindly guide me how to achive on click of the floating button, it will lead to same page's accordion number 6, and the accordion number 6 will open?

Truly appreciate.

Thank you.

Regards,
Melvin

This archived topic is closed to new replies.