Author: Alexander Buzmakov
Sometimes a situation may arise when you need one Toggle element on the desktop to be initially open, while on smaller screens it is necessary that all toggles are closed. A simple javascript code will help you solve this problem. So, in the Toggle element settings you should have the option Toggle Initial State > Open turned on:
In the Javascript tab of the first or any of the Toggle elements, add the following code:
jQuery(document).ready(function($) {
if ( $(window).width() < 992 ) {
$("[class*='expanded']").click();
}
});You probably already guessed that 992 is the value of the screen width. You can change this value according to your needs.
An example of inserting code into the javascript tab of a Toggle element:
Note: The code needs to be added once only to one Toggle. You can also place this code in the Code Block element, if it is already used on the page.
This is a very simple example, and depending on your task, you may need to refine the code.
This is a very simple example, and depending on your task, you may need to refine the code.