Farcheville Posted November 11, 2020 Share Posted November 11, 2020 Site URL: https://www.chateaudefarcheville.com/en/home Hello! I'm not super good with coding but I have an idea of what I want to do with a component that I want to add on to my clients website (only on mobile so with media query). It's basically just hiding the component on scroll down, reveal when on top of the page (or when scrolling up) Thanks in advance! Screenshots coming here Beyondspace 1 Link to comment
Beyondspace Posted November 11, 2020 Share Posted November 11, 2020 I saw you used a scroll based event here, please find and replace it with below <script> $(window).scroll(function(){ var scroll = $(window).scrollTop(); if(scroll > 50){ $('.language').addClass('scrollHidden'); $('.Header').addClass('scrollNav'); } else{ $('.language').removeClass('scrollHidden'); $('.Header').removeClass('scrollNav'); } }); </script> And custom css for it @media only screen and (max-width: 600px) { .language { transition: top .5s; } .language.scrollHidden { top: -10px; } } Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment