Jump to content

SarahGrubb

Circle Member
  • Posts

    4
  • Joined

  • Last visited

  1. Hi! I'm having the same issue on my site. https://seniorpost-cms.squarespace.com/new-home It's a vinmeo video uploaded as a section background. Resizing the page though, the visible part of the video get smaller and smaller until all I have left is the middle of the video. 😞 **update - Besides the other code snippets here, I tried changing the aspect ratio on the iframe to aspect-ration: 16/9 !important; widith: auto!important. If I insert different number, I do see changes there, but just moving the iframe left or right, I can't seem to get it to fully display correctly on mobile. Can someone help please?
  2. Hi, I need to only have a few sections from this site have the fade-in animation applied. The Work page does not need any animation. The Editors page (Along with the specific editors pages) do not need any animation. On the home screen, only the splash cover and the two section below that need the fad in effect. Does anyone know how to accomplish this? If I leave the animation on and try to target specific sections to turn them off, it messes with my gallery (the images disappear and the title (currently using css to center) are moved to the right). I can add a @keyframes to make certain blocks fade in, but that only makes them fade in all at once, not on scroll. I tried adding this in my header: <script src="https://unpkg.com/scrollreveal/dist/scrollreveal.min.js"></script> <script type="text/javascript"> window.sr = ScrollReveal(); </script> and this in my footer: <script> sr.reveal('#block-yui_3_17_2_1_1706580483778_2558','#block-yui_3_17_2_1_1706583736016_1833' {duration: 1500}); </script> But that doesn't affect it. This was added to remove the fade in from the footer (and works for the footer but not specific ID's): footer#footer-sections .preSlide, footer#footer-sections .preFade, { transform: translate(0,0) !important; opacity: 1 !important; }
  3. Update: I add pointer-events: none to the .image-slide-title and that did the trick!
  4. Hi, I am using a gallery block to add youtube/vimeo videos to a site. I add custom code to get the title to center and appear on hover. However, now that the Title is centered over the video, that spot on the video is no longer clickable (to get to the full screen). Is there a way to have the title centered over the video and make the whole video face, including where the title sits) clickable? Thank you! Here is the code I am using to make the title center over the image: .sqs-video-wrapper:hover .sqs-video-overlay:hover .sqs-video-opaque:hover { opacity: .7; word-wrap: break-word; } .image-slide-title { position: absolute!important; color:white; top:50%; left:50%; transform: translate(-50%,-50%); opacity: 0; font-size: 2rem!important; width: 50%!important; margin: 0px 0px!important; padding: 7px!important; white-space: normal!important; font-family: interstate; font-weight: 500; } .margin-wrapper:hover > .image-slide-title { opacity: 1; }
×
×
  • 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.