From to stay put when scrolling

[shalstead]

I want to create a "sticky" form on desktop only, so when I scroll the from stays visible at all times. Is this possible with the template I am working with and if so could someone give me a hand with this.

https://mobials-875893.hs-sites.com/mobials-automotive-suite-0-0-0?hs_preview=CbHrdZPY-6129044656

[tjoyce]

@shalstead - Try dropping the following code into the footer of your page: 

Here's what it will look like if successful: https://monosnap.com/file/lShg8wqdLh32uVGsR1kmtjNtj8FmvC

$(function(){
    var scriptEL = document.createElement("script");
    scriptEL.src='https://cdnjs.cloudflare.com/ajax/libs/sticky-kit/1.1.3/sticky-kit.js';
    $('head').append(scriptEL);
    $("#hs_cos_wrapper_module_147734029856912989").stick_in_parent({parent:$(".main-content"),bottoming:true});
});

---

If this answer helped, please, mark as solved 😄

---

tim@belch.io | forms.belch.io | Design your own Beautiful HubSpot Forms; No coding necessary.

Drop by and say Hi to me on slack.

[shalstead]

That's exactly what I would like the form to do! Thanks!

Although I cant seem to make it work. I have placed the above code in both footer area's (See screenshots). 

Should I be placing the code somewhere spefically in the css area?

[tjoyce · Accepted solution]

Sorry @shalstead - you need to wrap that code in script tags

<script>
$(function(){
    var scriptEL = document.createElement("script");
    scriptEL.src='https://cdnjs.cloudflare.com/ajax/libs/sticky-kit/1.1.3/sticky-kit.js';
    $('head').append(scriptEL);
    $("#hs_cos_wrapper_module_147734029856912989").stick_in_parent({parent:$(".main-content"),bottoming:true});
});
</script>

[shalstead]

That's exactly what I would like the form to do! Thanks!

Although I cant seem to make it work. I have placed the above code in both footer area's (See screenshots).

Should I be placing the code somewhere spefically in the css area?