disable bricks builder interactions for some breakpoints mobile responsive

this js script deletes the bricks animation attributes and classes when the page loads for set breakpoint

use it for all site or for some pages change the breakpoint depending on your setup

<script>
// Set the breakpoint for mobile devices
const MOBILE_BREAKPOINT = 767;

// Function to remove data attributes and a specific class
const removeAttributesAndClass = () => {
  // Check if the current window width is less than or equal to the breakpoint
  if (window.innerWidth <= MOBILE_BREAKPOINT) {
    // Select all DOM elements on the page
    const allElements = document.querySelectorAll('*');

    // Iterate over each element and remove the specified attributes and class
    allElements.forEach(element => {
      // Remove data attributes
      if (element.hasAttribute('data-interactions')) {
        element.removeAttribute('data-interactions');
      }
      if (element.hasAttribute('data-interaction-id')) {
        element.removeAttribute('data-interaction-id');
      }
      if (element.hasAttribute('data-interaction-hidden-on-load')) {
        element.removeAttribute('data-interaction-hidden-on-load');
      }

      // Remove the class if it exists
      if (element.classList.contains('brx-animated')) {
        element.classList.remove('brx-animated');
      }
    });
  }
};

// Listen for the DOMContentLoaded event to ensure the DOM is ready
document.addEventListener('DOMContentLoaded', () => {
  removeAttributesAndClass();
});

// Also listen for the resize event to handle changes in window size
window.addEventListener('resize', () => {
  removeAttributesAndClass();
});
</script>