* This method also opens the keyboard when user is on mobile.
So, this one is easy peasy ;)
Add this code to your page before </body> tag
<script>
$('.btn').click(function () {
$('html').animate({scrollTop: $('#email').offset().top - 200}, 1000);
$('#email').focus();
});
</script>
Then give your button a 'btn' ID, and to the input field 'email' ID.
THAT's IT !
really!
.png)
Whenever possible, use Class Names to target the elements in your interaction. You never know when you'll need to duplicate and use it somewhere else...
A (custom code) solution that combines CSS variables and Vanilla JavaScript for the shrinking / growing of browser top & bottom bars.
.png)
Change Webflow's Slider to act as a "regular" grid block on desktop, but go back to Slider on Tablet and smaller screens.
.png)
Using a little bit of jQuery to adjust the success message height
.png)