Disable body scrolling | Class Adder for Webflow Interactions

แชร์
ฝัง
  • เผยแพร่เมื่อ 1 ม.ค. 2025

ความคิดเห็น •

  • @DemianVenzke
    @DemianVenzke 6 หลายเดือนก่อน

    yeas, it worked fine! I added another trigger-class for the background (clicking the background behind the modal will close it too). Finsweet wrote the script very well. Thank you!

  • @leswins555
    @leswins555 3 ปีที่แล้ว +8

    Mine didn't seem to be working at first until I did one crucial step... I had to create the "no-scroll" class on the body element and set the overflow to hidden. Then I removed the class from the body element (since it has been created), and the code worked just fine. Thank you!

    • @newoctavian
      @newoctavian 22 วันที่ผ่านมา

      Thank you! You've saved my day! This type of interaction should be built-in in Webflow by default

  • @Colossus177
    @Colossus177 2 ปีที่แล้ว +1

    Uhhhhh. Holy Crap! You're a freaking genius! Just changed my life, thanks for sharing!

  • @samsqu4red
    @samsqu4red 3 ปีที่แล้ว +2

    Dude that was so lit and such a breeze to implement.. great job!

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      Glad you enjoyed it!!

  • @jarol024
    @jarol024 ปีที่แล้ว

    Worked amazing for me, this was what I was looking for. Thank you, dude!

  • @wolfgangderigo1652
    @wolfgangderigo1652 3 ปีที่แล้ว +1

    Hello Finsweet,
    I watch a lot of TH-cam videos and also your live broadcasts and I really have to tell you: YOU ARE FANTASTIC!
    I love your content, please keep doing it - Webflow is still a bit special at the moment and not as many use it as they should. If people like you keep generating good content, I'm sure Webflow will have a great future.
    Many thanks for everything
    Greetings from Austria
    Wolfgang

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว +1

      Thanks for the kind words. No plans to stop anytime soon.

  • @cwbydventura
    @cwbydventura 2 ปีที่แล้ว

    This worked like a charm!

  • @leonidmaksymyk5429
    @leonidmaksymyk5429 6 หลายเดือนก่อน

    thanks a lot for your tutorial!

  • @fancy3958
    @fancy3958 3 ปีที่แล้ว +1

    Epic, you deserve much more subscribers with no doubt! Super high quality, thx for the awesome job.

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      We're super thrilled hearing that!!! Thank you!!!

  • @ayushmukati9827
    @ayushmukati9827 3 ปีที่แล้ว +1

    Worked out perfectly! Thank you✌️

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      You're welcome!!

  • @MohsinAli-dx2cr
    @MohsinAli-dx2cr 3 ปีที่แล้ว +1

    Wow man. You are amazing. Thank you

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว +1

      You're welcome!!!

  • @CaioGonzalez
    @CaioGonzalez 3 ปีที่แล้ว +1

    man this is awesome! thank you so much!

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      You're welcome!!!

  • @java7629
    @java7629 3 ปีที่แล้ว +1

    wow, thank you so much!!!

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      You're welcome!!!

  • @alejandromilano4301
    @alejandromilano4301 3 ปีที่แล้ว +1

    thank you so much!!

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      You're welcome!!

  • @mucmuc3849
    @mucmuc3849 4 ปีที่แล้ว +1

    this is great, thanks for it

    • @Finsweet
      @Finsweet  4 ปีที่แล้ว

      You're welcome!!!

  • @madkeys_
    @madkeys_ 2 ปีที่แล้ว

    Thank you so much for this. Quick question: I have the ".no-scroll" and ".open-modal" classes added, but where do you actually add the ".close-modal" class?

  • @leandrofuenzalida2777
    @leandrofuenzalida2777 3 ปีที่แล้ว

    thanks, so simple to implement.

  • @filipdolansky4543
    @filipdolansky4543 3 ปีที่แล้ว

    Great stuff. Love that!

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      Thank you!!!

  • @mahekdave1968
    @mahekdave1968 3 ปีที่แล้ว

    Thank you bro.....

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      You're welcome!!!

  • @JustJayInHD
    @JustJayInHD 3 ปีที่แล้ว

    This isn't working on Safari iOS 15, it just scrolls past at certain points and not others, any fix for that?

  • @tuRistst
    @tuRistst 3 ปีที่แล้ว

    Will it disable scrolling for ios and touch devices?

  • @mr-be3sw
    @mr-be3sw 4 ปีที่แล้ว +1

    Nice video! Thanks :). Do you have a video where you explain how you build this? The scroll in the content part. I'm trying to make this. But I have no clue how to!

    • @Finsweet
      @Finsweet  4 ปีที่แล้ว +1

      You're welcome!!! You can clone the site and reverse engineer - webflow.com/website/Class-Adder-Interactions-Tool-How-To

    • @mr-be3sw
      @mr-be3sw 4 ปีที่แล้ว +1

      @@Finsweet Thank you! I already done that! :) Works great!

  • @filipdahlgren6386
    @filipdahlgren6386 3 ปีที่แล้ว +1

    Hi I cant get inte to work.. I have all my sections in one div so I can use fullpage snapping. Does this interfere with the (no body scroll ) script, or do you know what it can be ? 😊 thnx

    • @yacobu3000
      @yacobu3000 3 ปีที่แล้ว

      I have the exact same issue. Did you solve it?

  • @stephaniekuypers7319
    @stephaniekuypers7319 2 ปีที่แล้ว

    Thank you so much for the tutorial!
    I'm trying to make this work in a native Webflow mobile nav and can't figure out how to remove the no-scroll from the body when clicking a menu item as well. Do you write this as a separate scrip or does it form part of the same script?

  • @jeremydennis6908
    @jeremydennis6908 ปีที่แล้ว +1

    This no longer works. Can anyone else confirm this?

  • @JesseShauffer
    @JesseShauffer 4 ปีที่แล้ว +1

    Can this work with the webflow IX2 as well on the same trigger?

    • @Finsweet
      @Finsweet  4 ปีที่แล้ว

      Hey Jesse, yes it should without any issue

    • @olehansen6568
      @olehansen6568 3 ปีที่แล้ว

      This is great. I have a button that works as both the open and close trigger. Found another script on the webflow forum but after the second click it removes the modal alright but stalls/prevent scrolling the page. I really hope this class adder will do the trick.

  • @oscardariorendonzuluaga1318
    @oscardariorendonzuluaga1318 3 ปีที่แล้ว +1

    Nice, I would like have that JS code for my project. Thank you.

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      You're welcome! You can generate the code visually - class-adder-script-writer.finsweet.com/

  • @deepugopi9353
    @deepugopi9353 3 ปีที่แล้ว

    My website is automatically scrolling up to the top on mobile view. How can I disable that.

  • @evgenijlang8448
    @evgenijlang8448 4 ปีที่แล้ว +1

    Where does the class no-scroll come from? its not working on my website

    • @Finsweet
      @Finsweet  4 ปีที่แล้ว

      Hey! Thanks for using our product. Please send us a message on www.sweetjs.io/ and we might be able to help you! 🙂

  • @VineetKVlogs
    @VineetKVlogs 3 ปีที่แล้ว

    what tool is it ?

  • @funnellab
    @funnellab 3 ปีที่แล้ว

    Hey, it seems that putting the body of the page in "hidden" doesn't scroll on my side.
    However I did check if the "no-scroll" class was added when I hover over the relevant div and it is added. Do you have a solution to this problem?

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      Hey! Message us on sweetjs.io for help with implementation!

    • @Vlad-vd2on
      @Vlad-vd2on 3 ปีที่แล้ว +4

      HI, set .no-scroll: {height:100vh;}

    • @cobistancik
      @cobistancik 2 ปีที่แล้ว

      @@Vlad-vd2on this saved me thank you so much!!!

    • @arealhumanbeing_
      @arealhumanbeing_ ปีที่แล้ว

      @@Vlad-vd2on you saved me too! didn't work until I did this!

    • @jacqueschevrant8047
      @jacqueschevrant8047 หลายเดือนก่อน

      @@Vlad-vd2on Massive thanks!

  • @vianosuze
    @vianosuze 3 หลายเดือนก่อน

    not working
    when I type "no-class" in a body ... nothing gonna happen

  • @anthonybenez1045
    @anthonybenez1045 3 ปีที่แล้ว +1

    looks like not working in IOS safari :(

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      Send us a message on sweetjs.io, and we'll try to help you with this!

  • @arshadhussain39
    @arshadhussain39 4 ปีที่แล้ว

    Header shifts to the left when modal is opened

    • @Finsweet
      @Finsweet  4 ปีที่แล้ว

      Send us a message on www.sweetjs.io/ and we'll help you fix this!

  • @bjornszz
    @bjornszz 3 ปีที่แล้ว

    Doesn't work for me. I've literally spent months trying to solve this problem but I just can't get any solution to work... gah!

    • @Finsweet
      @Finsweet  3 ปีที่แล้ว

      Send us a message on sweetjs.io and one of our devs will help you out!