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

Search the Community

Showing results for tags 'hover'.



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 300 results

  1. Hey everyone, I want to achieve the action seen here in the header image section: https://www.equinox.com/groupfitness?icmp=topnav-classes I want my other thinks to fade on hover, and the background image to change for each link- using CSS. Attached a photo of the section of my site, same basic principles. Big titles that are linked over a background image. Anyone have some code that can accomplish this, or is this too complex for simple CSS? Thanks in advance!
  2. Site URL: https://andrea.co Hi there, I have a question. How do I change the hover color of my search icon? I've tried with this, but it doesn't work .Header-search-form a:hover { fill: #0a97a9 !important; stroke: #0a97a9 !important; color: #0a97a9 !important; } Thanks Andrea
  3. 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!
  4. Site URL: https://www.wouterleduc.com/shop Hi guys, I've started working on my webshop. Template Wells, this is the link: https://www.wouterleduc.com/shop I don't want any hover/overlay when the cursor is on the image/product. I can't find a code/solution to fix this. Does someone know a solution? Thanks in advance! Wouter
  5. Site URL: https://www.sleepycatrec.com/shop-admin I'd like to remove the quick view button all together, but keep the action of clicking opening the quick view box. Ideally, I could have a banner behind Product Details and completely hide Quick View Button so there is still a hover effect. If I could get hover to show the second photo AND a product details banner hover that'd be even better! Thanks
  6. Site URL: https://www.seapearls.com/lead-weight Site URL: https://www.seapearls.com/lead-weight Does anyone know how to change the font on the Products page grid to have a rollover? I just need the text under the thumbnails to change color on the hover state. Thanks! Sample page: https://www.seapearls.com/lead-weight (text under images to change color on hover)
  7. 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!
  8. 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; }
  9. Site URL: https://potato-sphere-g3k8.squarespace.com/about Hi! Does anyone know how to hover over an image and it will sort of light up with color and then text below it can appear? Website: naonow.com password naonow
  10. Site URL: http://www.ryanballphotography.com Hi there, I have setup my homepage with three images as a grid:overlay. I have set this to show text after I hover, this is perfect for desktop browsers and I don't want to change this. However for mobile devices, the text doesn't show (as the hover function does not work on touch devices). I therefore want to change this to "show text before hover" for mobile browsers, without affecting the desktop browser. So how do I keep "show text after hover" on the desktop browser and "show text before hover" on mobile devices. I'm using squarespace 7.1. web address is www.ryanballphotography.com. Thanks Ryan
  11. Site URL: https://www.theedgemaine.com/our-space When using a Grid Gallery with lightbox enabled, is there a way to remove the dark gray bar that slides up when the mouse hovers over the image on the desktop side? I've removed titles and image captions, but the empty gray bar still slides up.
  12. Hi, I'm wondering how I remove the gray overlay from the gallery grid hover. This is built as a gallery page and I don't want it to do anything on hover but can't seem to remove the option. Thanks!
  13. Site URL: https://bagpipe-heptagon-lcez.squarespace.com hello! I added a white button block with black text on my home page but I want it to change to black box with white text on hover? How do I do this? Thanks in advance :)
  14. Site URL: https://www.leonieguyer.com/ I want to change the rollover behavior of my site title only. The entire site is set to underline on rollover, which is great, but on the site title, I do NOT want the underline. Not sure how to do it. Been fiddling, but no luck. Here is the css I have for underlining (see below). Can I make this affect everything except the site title? a:hover { text-decoration: underline !important; } Thanks!
  15. Site URL: http://thisisaspace.net Hello! I need the hover text to appear on my mobile layout without having to tap it to come up but I don't want it to always be there. Anyone have a solution? Thanks!
  16. I would like to center the caption box when I choose 'hover image overlay' and I have scoured the forums to solve this. The caption defaults to the bottom of the image, and I would like a default to the center of the image. I am using Brine, and I can't figure it out.
  17. Site URL: http://denizdemir.photos Site URL: http://denizdemir.photos I'd like to simply have the gallery on my homepage display the gallery title when scrolling over the gallery image. The mouseover works on desktop but I find that people are not clicking on the gallery pages on mobile because they don't see the gallery title. Anyone might know some code for this to work? I'd only like to add this feature to the homepage on the mobile version. Thanks in advance.
  18. Im using Sonny /Brine and we would like to make the text on the poster highlight on Hover - I have seen a few of these questions but none have useful answers for me!
  19. I had originally asked this question years ago (here): https://forum.squarespace.com/topic/79514-css-for-rollover-effect-on-image-block-poster/#comment-121074 The selected answer worked really well for awhile. Although it appears the coding has changed and this css blocks the link from being selected. I have tried altering the css any way possible, but I can't seem to target the issue correctly. I had originally thought the z-index may be the issue but targeting the link and changing it's z-index didn't fix the issue either. Any help would be greatly appreciated!
  20. Hi! I'm trying to create a homepage with a list of my pages, but I want the background image to change as the mouse hovers over the page title... I've achieved this by using a portfolio template, but would prefer to just use CSS to keep it less complicated with navigation. I hope this makes sense! I've attached images if that helps :-) Thanks <3
  21. Site URL: https://snow-beach.com/ Hi, I'm wondering how one would go about formatting a slideshow to start only when a user is hovering over an image. Take this site for example: https://snow-beach.com/ And how to make the slides transition faster than 1 second with no fade in-between. Thanks.
  22. Hey, I'm trying to figure out how to isolate the header button on my website (using 7.1) so I can create a hover effect. I've tried using the chrome inspection tool but I can't find an element similar to .sqs-block-button-element that would isolate the header button. Any help in figuring this out would be greatly appreciated Website: https://hexaflexagon-star-bh8p.squarespace.comPass: square123
  23. Site URL: https://sturgeon-tangerine-zyeb.squarespace.com/ Hi, I already have my CSS set up to display the Summary Block item title and description on rollover, but I'm now looking to add to that functionality. Is there any way to have the actual thumbnail image change on hover? I want to be able to not only display text on rollover, but replace the image as well. Site password is scdp2020
  24. Site URL: https://www.benblenner.com/ Hey, I'm struggling to add hover titles to my gallery thumbnails. There is an option to display the title below each thumbnail but I'd like the title of the project to become visible on rollover. Any ideas? I'm using Avenue. Thanks!
  25. Site URL: https://www.thislandisdigital.com/test-rectangles I've already located code to create a hover effect from a recent post (though it needs to be written for every single thumbnail). All of the tutorials and tips I've found so far replace one image with another, though, whereas I would like to overlay an image on top of the currently hovered thumbnail. The effect will basically place a border, some glowing vignette, and a few stylized notches as if looking through a camera. The test index I'm using can be found here. The image I'd like to overlay is here. My current hover code looks like this (with some extra toys thrown in while I experiment!): /* On hovering over a specific block, affect its image. */ a.project:nth-child(1):hover img, a.project:nth-child(2):hover img, a.project:nth-child(3):hover img, a.project:nth-child(4):hover img { //visibility: hidden; opacity: 50%; //border-radius: 150px; filter: blur(2px); //grayscale(100%); //invert(100%); transition: all 0.5s; } a.project:nth-child(1):hover .content-fill, a.project:nth-child(2):hover .content-fill, a.project:nth-child(3):hover .content-fill, a.project:nth-child(4):hover .content-fill { background-image: url(https://static1.squarespace.com/static/5338f2a1e4b012d5a0b4b9e7/t/5e83d5e07a31383b2b77d2d3/1585698273099/Thumbnails_HoverImage_02.png); background-size: 100%; //or: cover; background-position: center center; background-repeat: no-repeat; } How do I make the image appear over top of the thumbnails? I don't really want to fade their opacity to reveal something behind them.
×
×
  • Create New...