Streaming live at 10am (PST)

Triggering interaction using a keyboard input

After a bit of research, I have figured out how to trigger a Webflow interaction using a key press or keyboard input.

Insert the following code before the </body> tag on your page:

<script>
      	$(document).on('keyup', function(event) {
      	if (event.which === 27) {
         	$('.CLASS-NAME').click();
       		}
        });
 </script>

You should replace ‘class name’ with the class of the element that would normally activate the trigger. Something like ‘popup-close’.

You should also replace ‘27’ with the number that represents the key you want to trigger the interaction. Find the key here.

Please note that this will only trigger ‘click’ interactions. It works by simulating a users click on an element, rather than directly triggering the interaction itself.

2 Likes

Nice tip @JSW.

Thank you for sharing with the community!

1 Like

I want to continue this old conversation because I had to go through a million threads to find this ONE simple solution to my focus issue … I have a trigger that opens a form when an H2 title is pressed. This works flawlessly with the trigger interactions in webflow but for Accessibility click through NOTHING worked. Aria labels - random other things I found in so many forum spaces. This solution needs to be highlighted and the problem that webflow has with ease of adding accessibility is honestly shameful for a company that has been in business since 2013 – it’s 2020 … and we are having to spend DAYS researching solutions for accessibility on this otherwise awesome tool! Ya’ll should kind of be ashamed of yourselves… and thanks @JSW for saving my ever loving life today with this fix!!!

1 Like

Exactly what I was looking for, thank you.

PS it would be nice if Webflow offered a key press as an interaction trigger.