winslowharte Posted November 17, 2021 Share Posted November 17, 2021 Site URL: https://winslowharte.com Hello - I am trying to get a similar effect as https://www.daynetanner.net/polymega . Landing on page displays an 'x' percent opacity w/ text overlaid, as you scroll down the text and opacity overlay disappear. I would like a similar effect on my projects: https://www.winslowharte.com/work/colorsonic etc. PW: 1234 Thanks! Link to comment
creedon Posted November 17, 2021 Share Posted November 17, 2021 Would something like the following do for your needs? colorsonic overlay.mp4 This uses CSS and Javascript and requires the business plan or above. Basically the technique is similar to what is used in the example site you pointed to. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
winslowharte Posted November 17, 2021 Author Share Posted November 17, 2021 @creedon exactly! So what you're saying is, since I cheap'd out and got the basic plan, I can't achieve this effect?! haha!🤪 IF I'm able to upgrade to a 'business plan' seamlessly could you help with a code that would get me close to that desired effect? Cheers! Link to comment
creedon Posted November 17, 2021 Share Posted November 17, 2021 Yep the effect requires Javascript to monitor the scroll position of the page and then change the opacity of the overlay, which requires the business plan or above to use. I have some rudimentary code to share if you decide to go with the business plan or above. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
klaudiabp Posted June 15 Share Posted June 15 @creedon Hi! So I want to do something similar with one of my sections on the website. I want it to change the opacity of the overlay when scrolling down. I have a business plan. Here I am sending an example of what I want. Thank you! Screen Recording 2023-06-15 at 11.49.15 AM.mov Link to comment
creedon Posted June 15 Share Posted June 15 I can't promise a solution but it would help us to see the section you reference. I also converted your recording into a format more folks can easily watch. Screen Recording 2023-06-15 at 11.49.15 AM.mp4 Please post the URL for a page on your site where we can see your issue. A link to the backend of the your site won’t work for us, i.e. a url that contains /config/. Please set up a site-wide password, if your site is not public and you've not already done so. Post the password here. Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site. Please read the site-wide password and how to share a link documentation to understand how they work. We can then take a look at your issue. You may find How to post a forum question post useful. tuanphan 1 Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. 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