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 Topics
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Topics
  • 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

Found 226 results

  1. Hi all! I need a bit of help with adding a hover effect over the masonry grid for 7.1. I'd like the description on the masonry grid to show on hover, as well as darken the image itself. Example: http://demo.squarestud.io/grid-gallery-9 I've read through a lot of other posts, but can't quite seem to find exactly what I am looking for. Any assistance would greatly be appreciated!! Thank you in advance! Diana
  2. Site URL: https://stillebliksem.squarespace.com Hi, i would like to disable to click through in this portfolio section. I do want to keep to hover effect that displays the pictures. When i add a 'no pointer event' ass custom code the click through is disabled but the hover effect is gone. I used this portfolio as a client list. There is no need on this page for a click through as I am building a complete portfolio on a different page. Any help is appreciated!
  3. Screen Capture2020-01-18 15_22_56.mov Hello I need some help with the CSS. Please see the attached video. Here you can see that when you hover over each image, the image falls back very fast. This css code works for squarespace 7.1 (masonry gallery image grow on hover) The zoom scaling needs a tweak or two. I need help in the css to make the image hover more smoothly when hovering over each image. /* masonry-gallery-image-grow-on-hover sqs.7.1 */ .gallery-masonry-wrapper :hover img { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; -webkit-transition-duration: 0.3s ; transition-duration: 0.3s ; -webkit-transition-property: transform; transition-property: transform; } .gallery-masonry-wrapper :hover img, .gallery-masonry-wrapper:active img { -webkit-transform: scale(1.1) ; transform: scale(1.5) ; } // end
  4. Site URL: https://coyote-aqua-7bd9.squarespace.com/ Hello, I'd like to change the hover color on my social icons to #90babb I am pasting this code within Design > Custom CSS Window and it's not working: .header-actions-action.header-actions-action--social a:hover svg { fill: #90babb !important; } Thank you in advance for the help! NS
  5. 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.
  6. Hi, I'm trying to change the color of a link, only on hover and when it's active. It currently works properly in my Nav, but I'd like everywhere else, specifically in body text and h2 (for example in the footer and the About page). Links should be black until you hover or they're active, when they should be #FFD801. I'm using the York template and my site is https://www.sarahrabinovich.com/. Thanks!
  7. Site URL: https://css-tricks.com/moving-backgrounds-with-mouse-position/ Hello, So i am new and need help https://css-tricks.com/moving-backgrounds-with-mouse-position/ how can i impement this to my background or a picture? I need help ASAP
  8. Site URL: https://hidano-demo.squarespace.com/ I'm in the process of building a new site to switch to 7.1 from the old platform, and I'm trying to use the portfolio function. One of the options is: Hover: Background - Displays the sub-page titles in a stacked or inline layout. When hovering over a title, the sub-page thumbnail replaces the section background. You can see the exact scenario on the Hidano demo https://hidano-demo.squarespace.com/ which is set to Hover: Background in the settings. Shouldn't the background change when you hover over the sub page titles (availability, amenities etc)? Nothing seems to happen for me. None of the portfolio hover options work in fact. I'm using Chrome. Am I understanding it incorrectly? Thanks for your time.
  9. Site URL: https://sarah-ward-interiors.squarespace.com/config/settings/site-visibility Hello, I am wondering how I can modify the CSS on my site to make a full image a hyperlink when I have a full image caption overlay active? I currently have the caption text activated as a link button, but I'd like the whole image to activate as the link. Question is applicable to the Portfolio page only of the site. Password is SWI2020. Thanks!
  10. Site URL: https://peterhadfield.com Hi there, Does anyone know how to add hovering titles to gallery images or video in the Wells Template? I assume I need to add CSS to achieve that, but I don't know much about CSS 😕 Any help appreciated. Thanks Peter
  11. Site URL: http://www.tillynelson.com I wanted to remove the line on my navigation menu and add a custom hover color. Managed to work it out so here is the code you'll need; Home > Design > Custom CSS > copy the below in; /* Nav item color */ black .header-nav-item a { color: #ff0000 !important; } /* Nav item hover color */ .header-nav-item a:hover { color: #709DD1!important; } /* Nav item active color */ .header-nav-item--active a { color: #709DD1!important; } /* remove underline on nav */ .header-nav-item--active a { background-image: none !important; } Extra notes: 1. #709DD1 = the HTML color code. Could replace with the words like red or blue if a standard colour. https://html-color-codes.info/colors-from-image/ - to find your html color code. 2. /* remove underline on nav */ .header-nav-item--active a { background-image: none !important; = just the part about the underline if you don't want to change colors. 3. Don't forget the } at the end.
  12. Site URL: https://www.joshwilkinson3d.com/doom-stamps My current website is on Wix but I have some gripes with it (won't go into that here). One thing that has me cautious about making the switch to Squarespace is the implementation of interactive images. I worked on a project a while back and one of the pages on my current site displays before and afters. What I did was basically input a large "button" that displays a different image for static display, hover, and click. Can I do something like that with Squarespace?
  13. Site URL: https://www.bluestonemanagement.com/ Hello! I am trying to create a hover effect over the first six images (Project Management, Quantity Surveying, etc.)so that when hovered over, they go from greyscale to colored. I'm having trouble finding/selecting the correct class (because nothing is happening when I do anything to the classes I find). What is the custom CSS needed to achieve this goal?
  14. Site URL: http://lauzza.com I've been trying for some time to achieve an effect where the title of my blog posts on my summary block change colour when the thumbnail is hovered over. I've tried for hours using my limited CSS knowledge but have only worked out how to do so when hovering over the actual title. This is the code I used for that: .summary-title-link:hover { color: hsl(147, 26%, 45%); transition: 0.3s !important; } If someone could help me do so that would be great, the page is http://lauzza.com and the password is lauzza123, thanks!
  15. Hi I have a gallery page on my (7.1) site which has a number of images whose titles are revealed upon mouse hover. Just simple text words on an image. However, on phones and tablets, which by nature have no hover, there is now no text on the buttons. I wonder if anyone can suggest a solution/workaround to this so that I can optimise these buttons for both device types- perhaps some code that determines if it's mobile or not and then disables the hover effect? Or should i make a separate duplicate page with different buttons and then some code so that mobile devices/tablets are redirected to that page atutomatically? Any help would be super useful! Thanks
  16. Site URL: http://www.sasakmarket.com I was wondering if anyone knows how is it possible to reveal button only on hovering. I have the buttons on top of the images but I would like to reveal these buttons only on hovering. Any idea how? Thank you guys
  17. Signed up or squarespace because some of my colleagues use it and have really nice sites. (I'm a photographer.) One thing that my colleagues have that I can't seem to create is an option to provide a caption when you hover over an image in a gallery. I'm using the Minetta template, but I don't see it in any of the other templates either. I can make it so the caption appears under the photo, but....yuck. Any ideas?
  18. Hi all, I'm in 7.1 and using a portfolio template with the setting 'Hover: Follow Cursor'. When I hover over the text, the image pops up properly, but there seems to be an overlay on top of it. Any idea how to change (remove) the overlay that darkens the images that pop up when you hover over the text? Thank you!
  19. Site URL: https://shark-hyperboloid-r297.squarespace.com/ I am creating a blog where each post will be an embedded youtube video. I really like the way the Portfolio style page handles hover/rollover animations in the grid view: https://shark-hyperboloid-r297.squarespace.com/songs There is a smooth darkening of the image (both when starting and ending the hover) and the title only appears on hover. I want to apply the same thing to the blog grid. I am using the blog because I don't want to be limited to 40 posts (I understand that is the limit for the portfolio pages) and I want to use categories to group similar posts together. https://shark-hyperboloid-r297.squarespace.com/ So far I've been able to add the "darkening" effect via CSS, but it's not as smooth. And I haven't figured out how to hide the blog title underneath and only show it on hover. Would really appreciate any help!
  20. I am using the Bedford template and I would like to change the "caption overlay on hover" feature so that the overlay covers the whole image, the whole image is clickable, and I can customize the colors of text and the overlay itself. The default "caption overlay on hover" style is a small transparent gray bar that overlays the very bottom of the image. I searched everywhere for a cohesive snippet of custom CSS code, and while there are several partial answers, I have yet to see something that covers all of my wish list. I'll keep tinkering and report back!
  21. Site URL: https://kumquat-raccoon-c9e5.squarespace.com/professional I'm using Squarespace 7.1 with the portfolio hover background option. When hovering over a link in the portfolio, I'd like the other links to disappear, similar to https://jordangilroy.com/. Here's the website: https://kumquat-raccoon-c9e5.squarespace.com/professional Password: test
  22. Hello, I've been searching for some answers all day and come close but nothing has worked so far. I'd like to entirely remove the hover effect that happens when I mouse over the thumbnail images on the Home page of my site which is set up as an Index in the Flatiron template. The url to my site is harrisonjohnson.work. Any help is much appreciated!
  23. Site URL: https://www.marcodiallo.com/ Hallo guys. this i my first web site design. and i dont know what im doing tbh. I have created a portfolio, and then added som projects. i have then added some images for my projects. now i would like to have som text appearing when hovering the mouse over the image. is this possible ? thank you all in advance. - marco
  24. Site URL: https://pufferfish-llama-7l86.squarespace.com Hi, I have been trying to speed up button hover effects but the css code I am using has no effect: " .sqs-block-button-element:hover { background-color: rgba(0, 0, 0, 1) !important; transition-duration: all 0s !important; transition-delay: all 0s !important } " The background-colour line has the desired effect so I thought the transition-duration line would also work, but it has no effect. Any suggestions? Liam
  25. What code shoud i try if i want my squarespace slider to pause when i hover over the slider??
×
×
  • Create New...