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

Search the Community

Showing results for tags 'hover'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • 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


Last Updated

  • Start


Filter by number of...


  • Start



About Me




Expert ID

  1. (Updated: SS 7.1) Some custom code (CSS) to change color Navigation Link Navigation Hover Link Navigation Active Link >> 92 Templates Navigation Custom Font Notes Add code to Home > Design > Custom CSS The code is based on demo at squarespace.com/templates, so they may not work for some websites or navigation with dropdown If the code doesn't work, try adding !important to after, eg: color: #f1f2f3 !important; If you have any questions/found issues, just comment below or send me a private message. Thanks. Avenue Template
  2. Hi! I am struggling to figure out how to have an image darken when the mouse hovers over it, rather than lighten to the color of the background. I'm working in the Forte template, into which I Frankensteined some code pieced together from various other forum posts and need some help with how to edit it so that the image darkens on hover(like this: http://demo.squarestud.io/grid-gallery-9). I'm pasting the code in use on the site below. Please help me, this is my first foray into code and I am totally clueless! Code: .sqs-gallery-block-grid .slide .margin-wrapper:hover a.image-
  3. Hi there, I'm wanting to add a cool mouse over effect when you hover on the images on the 'work' section of my site - heres the link to this section of the site: https://chipmunk-turbot-3bw7.squarespace.com/general-4 The kind of effect I'd like to add like the 'liquid' effect which you seem to be able to add to some images on squarespace or like the mouse over effect on this site's images https://www.hellomonday.com/. I'd only want that effect to be activated when the mouse hovers over the image. I'd also want to maintain the 'slide up' animation when the images initially load onto
  4. Site URL: https://www.annawasson.com/ As you can see on my site, when you hover over each portfolio image on the portfolio grid, there is a transparent black overlay with the caption. I have been tinkering with custom CSS to make the overlay a solid color (light blue) with the caption when you hover over it, but I can't seem to make the opacity completely opaque on hover. Let me know if this is possible.
  5. Site URL: http://francisleclerc.com Hello! I would like to change the hover effect on the homepage images for my website which is using the Jasper template. I would like for the images to change to a single color when hovering over. Each images would have a different color. If anyone could help it would be greatly appreciated! Thank you!
  6. Site URL: https://www.kaurinart.no/maleri/akryl Hello Have a problem with the autocrop i Squarespace. If you check out the link https://www.kaurinart.no/maleri/akryl you can see that some of the images when hovering over the products are cropped really bad. Is there any code I can use to fix this? Thanks!
  7. Site URL: https://robin-dog-9spw.squarespace.com/config/ Hello I'm trying to make images appear when hovering over text links. is a anyone available to help please?
  8. Can someone post the css code to add the hover effects into the navigation links like changing color or opacity? This used to be easy to accomplish on version 7 in templates but I don't know how to code it into my site on 7.1
  9. Site URL: https://www.josegallegosnieto.com/ Password: help --- Hello! Recently I applied the following code to change the color of text links on my site on hover. #page a:hover { background-image: linear-gradient(to right,currentColor 100%,currentColor 0); color: grey; } This works perfectly, changing my links to this appearance on hover: My problem is that this also applies itself to my portfolio-hover-fixed block, but as a background color. I need a way to exclude the portfolio block from the code mentioned above. In other words, I want that code
  10. Site URL: https://caper-badger-3s6d.squarespace.com/about Password: home I have noticed that the hover effect on social links at the bottom of menu nav, is a bit slow. If I hover over each of the social links fast, it takes a bit of time before the hover effect happens. Is it something that can be fixed?
  11. Site URL: https://scaacquisition2020.com pw:1234 This is making me nuts. I need to remove the image overlay that appears when you hover over the portfolio links on my homepage. There is no setting within the design color editor and I've set all "image overlays" to transparent just to be safe but still can't figure out what the CSS should be to remove this annoying default setting. EDIT: Here is the correct CSS for anyone interested .portfolio-hover-bg-overlay { display: none }
  12. Site URL: http://sophie-m.co.uk Hello, I was wondering if there's a way to add hovering titles over index images that follow the cursor when it moves. Example: https://carolinedussuel.com/ (I'm using flatiron) Thank you
  13. Hi, I am working on Squarespace 7.1 and I am looking to create a gallery page with titles on each image as you hover over them through custom css. (I want to use a masonry gallery as my landing page that clicks through to each project). Alternatively, I would like to know if it's possible to covert a portfolio index page to masonry - the only available option at the moment is to have equally sized squares.
  14. Site URL: https://www.randvisuals.com/portfolio Hey , I'm fairly new to squarespace so I appreciate any help that I can get. I've been trying to figure this out this past weekend, but no luck 😞. I want to resize the hover text to make it a little bit larger and easier to see. Also, I'm trying to add my logo the left side of the footer. Every time I post the logo, I can't seem to resize it. I even tried resizing it in photoshop and re-uploading, but no luck :(. https://www.randvisuals.com/portfolio
  15. Site URL: https://stereobild-stream.com/ Hey, Iam trying to build a hover effect to hide a gallery slideshow and show the title of the picture. I have build this for images and it works great but for the slideshow I ran in to some troubles. I manage to hide the slideshow by hover but ram not able to show the title. For the images I hid the image by overlaying the title full-size #collection-6023ddb5fbdbb45eab5a6bde{ /*Bilder - Plakat*/ .design-layout-poster .image-card-wrapper { visibility: visible; opacity: 0; transition-duration: 1s;
  16. Site URL: https://www.thefirst.vc/portfolio Hello, so i created image overlay effect for my portfolio page complete with custom css. It is working perfectly fine on desktop browser (https://www.thefirst.vc/portfolio) but its completely not working for mobiles. Can anyone suggest what can did i do here? How can i make this responsive? Code: <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <style> .flex-container { position: inherit; display: flex; } .img1-wrap { position: r
  17. Site URL: https://redplayback.uk Hello, Please could someone help. I have and image in the lower right corner of my footer. It has a link attached and would like it to zoom slightly on hover. I have tried some scc , but didnt work. Thanks.
  18. Site URL: https://www.endofanear.com/ Hello, How I can I implement a black 3px border when hovering over product images on the shop page? I just can't figure out the code on Squarespace. Also, how might I be able to add a small drop shadow to product images, as well? There's a whole bunch of different shop pages, but here's one: https://www.endofanear.com/jazz Thanks! 🗿
  19. Site URL: https://yardbirdrestaurant.com/ Hi, I have tried lots of different code I have found online but it still doesn't appear to be working. I am trying to get the hover colour of the buttons across all of the site and newsletter sign up buttons (including the header and footer) to turn #AF1D00 and keep the white text. Please could someone help! It would be greatly appreciated! Many thanks, Lily
  20. Site URL: https://whale-lemon-ebnr.squarespace.com/ I used the Wexley template in SS 7.0 to create a gallery of videos and photos. Without custom code, the only option is to have the title for these videos go under the video and I don't like how that looks. Is there a way to make it so that the title is shown on hover? This is how it appears on the Grid Gallery page but when you add it as a Gallery block on a different page (which allows more customization) it takes away this hover effect. Thanks in advance!
  21. Site URL: https://eagle-pear-f8dr.squarespace.com/packages Hello I've got some css hover effects on 3 images that I would like to disable so that the caption shows on mobile. Currently requiring a touch to display on mobile which isn't overly intuitive. https://eagle-pear-f8dr.squarespace.com/packages this is the url and the password is emmac123 to view the site. Thanks
  22. Site URL: https://www.autofreshagri.tech/ Hi everyone, I'm trying to get an image swap hover effect on each icon for my landing page. The effect, positioning + scale works when previewed in Squarespace however when testing in a browser tab the position + scale of the first images seem to change? When changing the block padding in Inspector from 17px to 0px it fixes this issue, however I can't figure out how to apply this properly in my CSS? Any help would be greatly appreciated! Thanks in advance. Website: autofreshargi.tech Code Used:
  23. Site URL: https://www.fab-medical.com Hi All i am attempting to replicate the underline effect that my menu bar has at the top of the website on the category names in the list on the sidebar of the shop page any help is much appreciated., https://www.fab-medical.com
  24. Site URL: https://www.roosbrothers.com/ I would like to add a text-indent animation to my project links on my homepage. I have managed to figure out the css to achieve the text-indent animation, however, I would like them to stay in the indented position until the mouse is no longer hovering over the link. Right now they bounce back to their original position immediately. Site is: https://www.roosbrothers.com/
  25. Hello, i need help and not sure if this possible but i'm giving it a shot. this is for my portfolio site on 7.1 I have a gallery reel with multiple projects inside of it on my HP...I want for all the entire reel to be highlighted with colored opacity and type so it indicated the entire reel is one section. i attached two images to show what i mean. please help! thank you Sam
  • Create New...