Show div on scroll (pixel amount) and animation problem

Technical Q&A
1

Hi there,

i have a custom buy button fixed on the bottom of the page on my product page.

I want to show the buy button when the page on mobile is scrolled 1200px from top.

My script is working, i added a animation fadein and fadeout, but the fadeout is not working.

Can anyone help me with this?

Website link (Look on mobile view): https://h1urnjbd20i0qkv4-61756834042.shopifypreview.com/collections/all-bonsai-trees/products/oubaitori

Thanks alot!


      
      

 

        

        {%- assign button_text = 'products.product.add_to_cart' | t -%}
        {%- if product.tags contains '_preorder' -%}
          {%- assign button_text =  'products.product.pre_order' | t -%}
        {%- endif -%}
        {%- unless current_variant.available -%}
          {%- assign button_text =  'products.product.sold_out' | t -%}
        {%- endunless -%}

        
          

          {%- if buybutton_setting -%}
            

              {{ form | payment_button }}
            
 
          {%- endif -%}