Jump to content

Julienne

Member
  • Posts

    3
  • Joined

  • Last visited

Julienne's Achievements

Level 1

Level 1 (1/20)

0

Reputation

  1. That worked, thank you so much!! Do you know of a way I could get the background images to be grayscale, and fade into color when the mouse is hovering? I found this CSS code online: #block-yui_3_17_2_1_1636006346935_2766 { transition: .5s ease-in-out; filter: grayscale(1); } .image-block img:hover { filter: none; } But it only makes the images grayscale, and it doesn't seem to make the hover into color work. Also, what do I put instead of #block-yui if it's for a background image. I don't want the whole section to be grayscale, only the background image.
  2. Thanks for replying! I did what you said to (I think). 2 sections, one on top of the other, with the background images and the corresponding image blocks. Let me know what the next step is! 🙂
  3. Site URL: https://juliennecarrots.squarespace.com Site URL: https://juliennecarrots.squarespace.com Site password: Password Hi there, I need help trying to achieve a few different things. I'm currently working on a split landing page for my website, in order to choose which half of the website to visit. Here's what I'm having trouble doing: I'm trying to have two images bleed to the extents of the page. I've got them as image blocks side by side, but right now there's still space between the images and around them. I'm trying to have them be right next to one another, and fill the extents of the screen. (The images of the ladies are the ones wanted in the background) I'm trying to have the images be in grayscale, but then revert to color when the mouse is hovering on them. Below (the list) is the CSS I'm using to try to achieve this, but with no success. I also want two other images (the two logos) to be overlayed over the background images, and act as link buttons that bring you to the respective split homepages. I have the link/button functions working fine, but I can't seem to figure out how to overlay these logos over the two images below that I want in the background. Also, I can't seem to find a way to change the sizing of these images. I'd like them at about 50% of what they are now. Custom CSS for grayscale to color hover: #block-yui_3_17_2_1_1636006346935_2766 { transition: .5s ease-in-out; filter: grayscale(1); } .image-block img:hover { filter: none; } #block-yui_3_17_2_1_1636006105660_3251 { transition: .5s ease-in-out; filter: grayscale(1); } .image-block img:hover { filter: none; } I would love help figuring these things out. Thank you so much! I really appreciate it.
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.