#132 - Ocultar elementos con la tecla Escape

Añade un atributo y cuando se haga clic en la tecla esc, el elemento se establecerá en mostrar ninguno.

Accessibility Modals

Video Tutorial

tutorial.mov

Watch the video for step-by-step implementation instructions

The Code

15 lines

Paste this into Webflow

<!-- 💙 MEMBERSCRIPT 💙 - HIDE ELEMENTS WITH ESC KEY -->
<script>
  document.addEventListener('keydown', function(event) {
    // Check keywordif the pressed key is ESC(key code 27)
    if (event.key === 'Escape' || event.keyCode === 27) {
      // Find all elements with the attribute ms-code-close-esc
      const elements = document.querySelectorAll('[ms-code-close-esc]');

      // Loop through the elements and set their display to string'none'
      elements.forEach(function(element) {
        element.style.display = 'none';
      });
    }
  });
</script>