Tagged: curtain 3d, masonry, trasparency effects
-
AuthorPosts
-
April 5, 2023 at 9:45 am #1403583
Hi, would it be possibile to have the curtain transparent instead that white on the masonry gallery (section last events at the bottom of the home page) on my http://www.giravoce.com?
Second I’d would like to have a curtain effect like this seen on http://preview.themeforest.net/item/pistis-creative-portfolio-agency-wp-theme/full_screen_preview/18853580?_ga=2.163275775.230948212.1680678460-502609733.1680678460&_gac=1.26720591.1680678978.Cj0KCQjwuLShBhC_ARIsAFod4fK_6Ci7eCcwRyt1JyJGtTv8UxjGbsIyd0F7PsnqQjOLXCBDAJdTHQQaAlrOEALw_wcB that you can see scrolling down the page
Thanks for your help
GianlucaApril 8, 2023 at 6:38 pm #1403895Hey Gianluca,
Thank you for your patience, but it looks like you have already sorted out how to make the masonry overlay transparent instead of white.
As for your second question on your example page when you scroll down the top section is scaled down with javascript using transform: scale(); I can’t see the javascript used. I recommend using a plugin or a library like https://greensock.com/scrolltrigger for example: https://codepen.io/snorkltv/pen/oNBGzOE
or something like this: https://stackoverflow.com/questions/64464798/transform-scale-on-scroll
but you will need to tinker with it.Best regards,
MikeApril 16, 2023 at 11:03 am #1404574Thanks for your answer but the trasparency effect does not work as I would.
At the section “last events” the texts are still with white background and not tranparent as you can seeApril 16, 2023 at 3:47 pm #1404594Hi,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:.av-masonry-item-with-image .main_color .site-background { background-color: transparent; }
After applying the css, please clear your browser cache and check.
But you might find the gray text hard to see, so if you want to also change the text color try this css:.av-masonry-item-with-image .main_color .site-background { background-color: transparent; color: #fff; } .av-masonry-item-with-image .main_color h3.av-masonry-entry-title { color: #fff; }
Best regards,
Mike -
AuthorPosts
- You must be logged in to reply to this topic.