Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Search the Community

Showing results for tags 'opacity'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers 🇫🇷's Topics
  • France Designers 🇫🇷's Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location


Badges

Found 30 results

  1. Site URL: https://wisteria-panda-z2eg.squarespace.com/home Dear All, I have been researching for days with no success. is it possible to have sections with „soft edges“? By that I mean, if I have a section with black background and it overlaps with a section with an image background, can the edge of the black section have something like a transparency or opacity gradient? I want it to look like the image and black blend / morph into each other. To complicate things further, the image also has a parallax. Check it out here: https://wisteria-panda-z2eg.squarespace.com/home pw: rotorsound The section with the instagram block should have the soft edge at the top. Thank You 🙏🙏
  2. Hi all, I'm having trouble changing the opacity of a heading background color in the custom CSS field. I'm using the code below and thought the .5 in the final line would make opacity 50%. But it isn't working for some reason I can't figure out. #block-yui_3_17_2_1_1595131393232_6522 { padding-top: 20px; background-color: #292b47; /* fallback for old browsers */ background-color:rgba 41, 43, 71, .5; } The attached screenshot is how the block renders.
  3. Site URL: https://sponge-dalmatian-cgjy.squarespace.com/ Hello all, I have a portfolio page as my cover page currently with the layout Hover: Fixed. I have icons that are supposed to be transparent as the hover images, but Squarespace is adding a black overlay on top of them. A Squarespace agent let me know that this is an known issue but that I would currently need to use custom coding to get rid of the overlay. I was wondering if anyone here could help me out? The website is password protected, the pw is 123. I've attached a screenshot of what I mean - I do not want the gray background there. If there's also a way to reduce the actual transparency of the image itself through custom coding so that the project titles can be seen and not just blend in, that would be great as well.
  4. I'm attempting to add more contrast between the background header video and the navigation. I added the Vimeo file Selected Black Minimal theme to have a white navigation text. Added opacity filter to the video to increase the contrast The background color is displaying white and therefore decreasing the contrast. Any thoughts, or a bug in Squarespace.
  5. I am very new to all this and cant seem to find a way to center the descriptions of the images in the gallery. It appears I need to add some CSS coding. Everything I've found seems to be out dated. I would also like to know how I could change the opacity slightly upon hovering over the image. Please help or point me to the correct forum.
  6. I have worked thought a few CCS mods to get my gallery image block lightbox to look they way I want it to. I am having a problem getting the lightbox opacity to be 1 or full background with no opacity. Every time I inject a CCS mod the element z-index and opacity revert back to opacity:0.98 I have tried several variation but nothing works. Here is the latest CCS I injected. .yui3-lightboxoverlay-content .sqs-lightbox-overlay .sqs-lightbox-overlay-default.light.element { z-index: 10000000; opacity: 1; }
  7. Hello, I'm looking for some advice on how to make the background of a lightbox opaque white, rather than transparent. Thanks in advance.
  8. Hi guys I'm trying to create a hover effect whereby the image fades out and the title appears. When I hover over the title I completely lose the opacity effect! I've cobbled together some code from lots of different places on this forum so it's probably super obvious where I'm going wrong. The page url is https://damien-creagh.squarespace.com/drama-gallery Would really appreciate some guidance. Thanks! Here's the code I'm using: img.summary-thumbnail-image { opacity: 1; transition: opacity .7s; } img.summary-thumbnail-image.loaded:hover { opacity: 0.3; } .sqs-block-summary-v2 .summary-item .summary-title { transform: translateY(-10%); opacity: 0; transition: transform .6s ease-out, opacity .5s; hyphens: auto; text-align: center; position: absolute; left: 20%; top: 50%; width:70%; margin-left: auto; margin-right: auto; } .sqs-block-summary-v2 .summary-item:hover .summary-title { transform: translateY(0); opacity: 1; text-align: center; position: absolute`enter code here`; left: 20%; top: 50%; margin-left: auto; margin-right: auto; width: 70%; hyphens:none; } .sqs-block-summary-v2 .summary-item .summary-title a { font-size: 1em; z-index:20000 !important; font-size: 140%; color: #2a2a2a; display: block; }
  9. Site URL: https://tarpon-lavender-jbyy.squarespace.com/ Password to the site is: TEMP I'm having problems making the header opacity appear semi-transparent. The options when editing the header are simply solid colour, or fully transparent. What I'm trying to achieve is a semi-transparent header, that has an opacity of 50%. The site is on the Eldridge template, so Squarespace 7.1
  10. Site URL: http://www.caitlinhutson.com I have already copied a CSS to change opacity of the overlay on my posters when hovering. The code I used is the following: .image-overlay {opacity: 0; transition: .3s ease;} .image-overlay:hover { opacity: 1} It gives the effect of turning the whole block from my image to an opaque green, with the text showing in both. However, when not-hovering, I added a background color to my Title Text to make it easier to read, and I would like that background to fade out as the opaque green fades in (since the text is very visible on the green without that extra coloring). I tried to use the same format as above but can't figure out what the item is called to make this change. I am looking to do it to all of my posters, so a code that applies to all would be awesome.
  11. Site URL: https://bailard-demo.squarespace.com/ Hi guys, fairly new Squarespace user here. I've started the creation of a website using the "Bailard" template (provided above) and for some reason I can't change the opacity on any of the image blocks used? Everything seems to have a tint to it that I'd like to get rid of. The Larger first image gives you an option to change it, but as you move down into smaller blocks that option is no longer available. I have very limited coding experience. Any help on this would be welcomed. Cheers,
  12. Trying to darken the opacity when I hover over images on my portfolio site. Currently the opacity is too light and my title text doesn’t mesh well with my images. (See attached screenshot - Drew League example). Possible to do so? Any help is much appreciated!
  13. Hi, I have a hyperlinked image block where I'd like for the below to happen upon hover: - Text to appear over the image - White opacity over image I've managed to get this to work using the below CSS code however it seems to have messed up the image clickthrough function. I believe the problem is specifically with the white opacity over image which seems to be disabling clickthrough function. Help! Here's the code I'm using... p, h1, h2, h3 { -webkit-hyphens: manual !important; -moz-hyphens: manual !important; -ms-hyphens: manual !important; hyphens: manual !important; } .design-layout-poster .image-card-wrapper { visibility: hidden; opacity: zero; } .design-layout-poster:hover .image-card-wrapper { visibility: visible; opacity: 1; } .image-block .image-linked:before { content: "";width: 100%;height: 100%;position: absolute;z-index: 1;top: 0;left: 0; opacity: .6;background:; } .image-block .image-linked:hover:before {background: white;opacity: .3;transition: all .2s ease-in-out; }
  14. Site URL: https://www.kimsedgwick.co.za/ Looking to add hover text and an opaque white block on my index page - collection gallery. As it stands, the text is currently over the image permanently, I want this to only appear when you hover over the image. There is currently a faint opacity that appears when the image is hovered over, I want to decrease the opacity so It becomes a bit more white and you see less of the image. See images attached for reference. My current site and what I am looking for, the images attached of what I am looking for has a solid white block and the text appears when hovered over but I would prefer mine to be less opaque than it is now but not solid . Thanks so much!
  15. Hi All- I'm working to make my image title backgrounds transparent so that I can apply a section background without having a weird box: I'm using an Image Card block and found out how to make the image portion of the block and content section have a transparent background, but cannot figure out how to make the Card title have a transparent background. Happy to provide any additional information. Thank you in advance. Greg
  16. Site URL: https://www.kimsedgwick.co.za/ Hi there, Looking to make my image blocks on my works page less opaque, so that one can read the text that pops up in the centre of the block when hovered over. They currently have a very opaque block when hovered over, but I would like this to be a lot more solid. See images below Thanks very much.
  17. Site URL: https://www.familievejlederen.dk/ Hi all, Sadly I find myself in a situation where navigation on mobile in version 7.1 doesn't work properly with anchor links. I know more people have experienced this and there's still no fix from Squarespace. As I would hate to make a redo of the site and hope that Squarespace will fix the error soon, I want to make a "quick fix" being changing the opacity of the mobile menu background. As I have NEVER played with custom CSS in Squarespace (they say I shouldn't up to now .. haha) I need a little help. Is there any of you who can show me the bit of custom CSS code that can be used to change the opacity of the mobile menu background in version 7.1? Thank You, and if others have experienced the same error with anchor links and mobile navigation in version 7.1 I'd like to hear what you've done to fix it. Best regard Maija https://www.familievejlederen.dk/
  18. Site URL: https://www.patsimpsonart.com Need some help with some CSS to change hover colour and opacity 7.0 Flatiron Password: T3mppass!
  19. I have worked thought a few CCS mods to get my gallery image block lightbox to look they way I want it to. I am having a problem getting the lightbox opacity to be 1 or full background with no opacity. Every time I inject a CCS mod the element z-index and opacity revert back to opacity:0.98 I have tried several variation but nothing works. Here is the latest CCS I injected. .yui3-lightboxoverlay-content .sqs-lightbox-overlay .sqs-lightbox-overlay-default.light.element { z-index: 10000000; opacity: 1; }
  20. Does anyone know how to change the opacity of the overlay on images?? A few people seem to have asked here but no answers yet...any help would be great!
  21. I'm experimenting with banner opacity. I'm also interested in providing some shadowing under images and other text boxes. Thoughts? www.thehouseofdavid.org
  22. I am creating a website using the Henson template (Tremont family). I have used the Design > Site Styles to set up overlay opacities that I like, but there is one customization that does not seem possible with the built-in styles: At the bottom of each "Portfolio" index (/brand, /data, and /web), the "collectionDesc" reappears, overlaid on the media image for that index. I would like to add a white background overlay at 95% opacity when this happens, so the image looks ghosted and the text is more legible. I can accomplish this by setting the Overlay Opacity under "Index Overlay/Background Colors" in Site Styles, but the images then continue to look ghosted on that page and throughout the site when the collection is active (mouse is hovering over the collection menu). Is there code injection I could add to the header of the 3 portfolio index pages (brand, data, and web) or to the site-wide Custom CSS that will set the "Index Overlay/Background Colors" to #fff 95% opacity only when the "collectionDesc" is visible? You can view the in-progress site at the link below: https://gar-opossum-4ch5.squarespace.com/ password = chameleon I have also attached images to help demonstrate the issue: 1. How the "collectionDesc" looks at the bottom of the /web index with no "Index Overlay/Background Colors" visible (opacity set to 0) 2. How I want the "collectionDesc" to look at the bottom of the /web index * 3. How I want the collection media to appear on hover * * note: #2 and #3 are mutually exclusive using the built-in Site Styles (increasing opacity to achieve #2 ghosts out #3 and vice-versa) Any guidance on resolving this issue would be much appreciated!
  23. Hi guys, our site (https://www.museumofplayandart.com.au/) is built on the Naomi Template (A member of the Pacific Family). I'd like to remove the opaque black overlay being applied to the banner image. I've searched the forums, tried all the code listed in various posts relating to similar matters, all to no avail. Is there code I can inject in Advanced to overide this overlay? Thank you so much in advance. Regards, Tom
  24. Hi. I'm attempting to change the opacity of my banners on mobile as the parallax is falling too far behind the text and making it difficult to read. Can anyone advise a CSS injection that would change the banner opacity on mobile only so that the banner is more faint? Many thanks in advance,
  25. Under colors > sitewide > background overlay I can set the color to black, but is there anyway to make the overlay darker? I need something like: background: rgba(0, 0, 0, 0.7) And cannot find the element to change in inspector tool. This functionality existed with 7.0 iirc.
×
×
  • Create New...