You're dealing with two issues: a non-responsive submit button in your custom slider form, and making the slider progress to the next slide after submission to show a Calendly embed. Here's how to address both problems.
onclick
or addEventListener
) and that it’s not being blocked by preventDefault()
or an error.<form>
element—Webflow requires that form structure to trigger native behaviors.tag section.
<div id="calendly-inline-widget">
plus link script) inside an Embed element in that new slide.loading="lazy"
to the <script>
tag if you’re using defer/lazy load techniques.Use Webflow’s native Slider API or add custom JavaScript to manually move to the next slide after successful form submission.
Here’s an example using vanilla JavaScript and Webflow’s jQuery-powered slider:
Wait for the form to submit using Webflow.push()
:
Code to add in your Page Settings > Before tag:
```js
```
Replace .your-form-class
with your actual form class name.
If you're using the native Webflow Slider, use:
$('.w-slider-arrow-right').trigger('tap');
instead of the slickNext()
method above.
Fix the submit button by ensuring your custom code uses correct form structure and event handling. To show the Calendly booking screen after submission, embed it in the next slide and use JavaScript to programmatically advance the Webflow slider upon form submission.