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

  1. 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?
  2. 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
  3. 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?
  4. 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!
  5. 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
  6. 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
  7. 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.
  8. 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?
  9. 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!
  10. 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!
  11. 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!
  12. 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!
  13. 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
  14. 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!
  15. 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
  16. 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
  17. What code shoud i try if i want my squarespace slider to pause when i hover over the slider??
  18. Site URL: https://potato-sphere-g3k8.squarespace.com/config/design/custom-css Hi! Does anyone know how to add a "slide up" effect to text when you hover over text on boxes? @tuanphan Website: https://naonow.com/about password: naonow
  19. Site URL: https://potato-sphere-g3k8.squarespace.com/config/?frameUrl=/about Hi! How do I set all text to be the exact size of these images on all devices? And for the black background to fill the whole picture without a scroll. I shortened the text for the top images but for some reason they aren't expanding to the exact size of the images. As well, is there a way to add a slide up effect for the text? Thanks!! @tuanphan
  20. Site URL: https://fortheloversphoto.squarespace.com Hi! I've added CSS to my Image Blocks with the Caption Overlay (hover) effect to have a transparent overlay on the images. You can see the current style here: https://fortheloversphoto.squarespace.com I just realized that the hyperlinked photo is now covered by the overlay effect, so there's not clickable area on the overlay. Is there a way I can add a link to the overlay itself, with just CSS? Specifically whatever the link is for the image? I want to make sure my users will be able to click through to the linked galleries.
  21. (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 /* Nav item color */ .main-nav ul li a { color: #ff0000 !important; } /* Nav item hover color */ .main-nav ul li a:hover { color: violet !important; } /* Nav item active color */ .main-nav ul li.active-link a { color: green !important; } Aviator /* Nav item color */ nav#main-navigation ul li a { color: #ff0000 !important; } /* Nav item hover color */ nav#main-navigation ul li a:hover { color: violet !important; } /* Nav item active color */ nav#main-navigation ul li.active-link a { color: green !important; } Bedford Family: Anya, Bedford, Bryant, Hayden, Bedford /* Nav item color */ #mainNavigation div a { color: #ff0000 !important; } /* Nav item hover color */ #mainNavigation div a:hover { color: violet !important; } /* Nav item active color */ #mainNavigation div.active a { color: green !important; } Brine Family: Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Custom Template, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Lincoln, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West, Brine. /* Nav item color */ .Header-nav-item { color: #ff0000 !important; } /* Nav item hover color */ .Header-nav-item:hover { color: violet !important; } /* Nav item active color */ .Header-nav-item--active { color: green !important; } Farro: Farro, Haute Same as Brine Five /* Nav item color */ nav#main-navigation ul li a { color: #ff0000 !important; } /* Nav item hover color */ nav#main-navigation ul li a:hover { color: violet !important; } /* Nav item active color */ nav#main-navigation ul li.active-link a { color: green !important; } Flatiron /* Nav item color */ ul#nav li a { color: #ff0000 !important; } /* Nav item hover color */ ul#nav li a:hover { color: violet !important; } /* Nav item active color */ ul#nav li.active-link a { color: green !important; } Forte /* Nav item color */ #topNav ul li a span { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover span { color: violet; } /* Nav item active color */ #topNav ul li.active-link a span { color: green !important; } Ishimoto /* Nav item color */ #topNav #nav li a { color: #ff0000; } /* Nav item hover color */ #topNav #nav li a:hover { color: violet; } /* Nav item active color */ #topNav #nav li.active-link a { color: green !important; } Momentum /* Nav item color */ #topNav ul li a { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover { color: violet; } /* Nav item active color */ #topNav ul li.active-link a { color: green; } Montauk: Julia, Kent, Montauk, OM Same as Momentum Native /* Nav item color */ #navBlock ul li a { color: #ff0000 !important; } /* Nav item hover color */ #navBlock ul li a:hover { color: violet !important; } /* Nav item active color */ #navBlock ul li.active-link a { color: green !important; } Pacific: Bryler, Charlotte, Fulton, Horizon, Naomi, Pacific /* Nav item color */ #mainNavigation div a { color: #ff0000 !important; } /* Nav item hover color */ #mainNavigation div a:hover { color: violet !important; } /* Nav item active color */ #mainNavigation div.active a { color: green !important; } Skye: Foundry, Indigo, Ready, Skye, Tudor /* Nav item color */ .nav-blocks-wrapper div a span { color: #ff0000; } /* Nav item hover color */ .nav-blocks-wrapper div a:hover span { color: violet; } /* Nav item active color */ #mainNavigation div.nav-link--active a { color: green !important; } Tremont: Camino, Carson, Henson, Tremont /* Nav item color */ #mainNavigation div a span { color: #ff0000; } /* Nav item hover color */ #mainNavigation div a:hover span { color: violet; } /* Nav item active color */ #mainNavigation div.active a span { color: green; } Wells /* Nav item color */ div#topNav ul li a { color: #ff0000 !important; } /* Nav item hover color */ div#topNav ul li a:hover { color: violet !important; } /* Nav item active color */ div#topNav ul li.active-link a { color: green !important; } Wexley /* Nav item color */ #topNav ul li a { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover { color: violet; } /* Nav item active color */ #topNav ul li.active-link a { color: green; } York: Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, Taylor, York /* Nav item color */ .site-navigation div a span { color: #ff0000; } /* Nav item hover color */ .site-navigation div a:hover span { color: violet; } /* Nav item active colo */ .site-navigation div.active a span { color: green; } Squarespace 7.1 /* Nav item color */ .header-nav-item a { color: #ff0000 !important; } /* Nav item hover color */ .header-nav-item a:hover { color: violet !important; } /* Nav item active color */ .header-nav-item--active a { color: green !important; } Created by Tuan Phan. Share to be shared more.
  22. Site URL: https://alligator-buffalo-slhk.squarespace.com/projects-1 Hi, Does anyone know if i can create a hover effect on a background image using CSS ? (as opposed to an image block). I want to create a white overlay on all backgrounds on this page, https://alligator-buffalo-slhk.squarespace.com/projects-1 ... and only reveal full colour of image on hover. (We are using full bleed backgrounds, rather than image blocks, to achieve a transparency on the header) -Andrew
  23. Site URL: https://www.erobertson.design/ The homepage of my portfolio site features index images of each project. When you hover over each image, it reveals the project title. I would like to add a 1px outline stroke to these images (67% black), but only in the hover state. I am using the Jasper (York) template. Can anyone help?
  24. I'm looking to make all the links on my page magenta, but ONLY when being hovered over. I have them designed per section so I dont want them to be uniformly one color, but i want them to all have the same color when being hovered over. Every custom css ive found makes all of the links that color even when not being hovered over. my color is #C71585 C71585
  25. Site URL: https://destoursrecords.squarespace.com Hi everybody, First of all I hope you all are save and good with this covid-19 virus raging around the world. I'm far from beeing a coder/website builder but i'm trying with the experience and resources I have to build a website for music label. And I would like to adapt the standard Brine / WAV template but i'm running in some problems that I tried to fix with some CSS code... but it maked it more worse then better. So I'm asking your help guys. SITE : https://destoursrecords.squarespace.com PASS : destours2020 So I would like to change with some CSS coding : 1. Standard in every text box on every page, that a hyperlink is in the same color as the text // hsl(180, 35%, 14%) // and when hovering over the hyperlink it turns in yellow // hsl(45, 100%, 54%) // but WITHOUT underlining (like in the header menu above) 2. Standard in the footer box on every page, that a hyperlink is in the color // hsl(46, 0%, 35%) // and when hovering over the hyperlink it urns in yellow // hsl(45, 100%, 54%) // but WITHOUT underlining (like in the header menu above) 3. In the footer I have a subscribe box... It's making the footer to big. Is it possible to "compress" it more horizontally? That the space between every line is smaller? I tried some CSS coding from the help section and here on the forum but it more harm then good to my site, Thank for you time reading my problem! Hope you guys can help me! All the best, Maurice
×
×
  • Create New...