@Fabian_Colnaric - If you look at the page source you can see where it is loaded; right before the body close. So any JavaScript that loads jQuery needs to be in the 'before page body close" custom code area OR you could use the following anywhere with Webflow’s push function;
<script>
var Webflow = Webflow || [];
Webflow.push(function () {
// your code with JQuery
});
</script>
Okay,
but it’s not working without the jquery in my case. Should I place the code in the body or head?
Got it working!
Here is Fabians code wrapped in Jeff Selsers push function (without loading jquery twice):
Ive also added Esc on the keyboard as a way to close the menu.
Remember to replace the class .close-dropdown with your own
<script>
// Close dropdown
var Webflow = Webflow || [];
Webflow.push(function () {
$(document).ready(function() {
$('.close-dropdown').on('click', function () {
$(".w-dropdown").trigger("w-close");
});
$(document).on('keydown', function (e) {
if (e.key === 'Escape') {
$(".w-dropdown").trigger("w-close");
}
});
});
});
</script>
No way that this is the working code. I tried so many other (waaaaay more complex) suggestions :o !!!
Thank you so much!! This worked perfectly. For anyone who needs more context, replace .close-dropdown with any class on the links being clicked inside the dropdown
Thank you for adding clarity. That ended up working for me!!
This ended up working, thanks!!
How were you able to point to a specific selector? I have my drop-down nested and even if I call a specific ID or class to close they all close.
var Webflow = Webflow || [];
Webflow.push(function () {
$(document).ready(function() {
$('.closedd-papa').on('click', function() {
$('.papadd').trigger('w-close');
});
});
});
The code works great on the webflow staging .io page itself but once I publish it to a custom domain it stops working.
@adanmacreates Hi and then what’s next? I’m not a coder could you give me a step by step and tell me where to put the code exactly?
