Jump to content

gcerceo

Member
  • Posts

    37
  • Joined

  • Last visited

Posts posted by gcerceo

  1. O, just realized the effect is not fading in or out with the scroll up or down the page. The page is smooth scrolling though, and that's nice.

    The effect I'm going for is more like a status bar scroll, with the copy fading in/out when the viewport reaches that section. Does that make sense?

     

    And it's all screwed up on mobile, I'll need to add a parameter for it to resize the copy for the mobile version.

    https://www.grahamcerceo.com/

  2. This is great, thank you! Need to do some tweaking to make it work.

    How can we keep the code box from being so long and making the section so long, after inputting all that code into it? And, I'd like to make the text my H2 size.

  3. Love it. Thank you. In my own coding, I was missing the other containers above the lowest level.

    Now to tweak. What other tag can I use to make the pill wrap to the varied length of the caption for each of my portfolio thumbnails? And, expand it to be a little taller. 

    Follow up, to ensure it scales appropriately for mobile. Assuming I'll need the min-max screen size tags, right?

    Screenshot 2024-03-20 at 9.56.01 AM.png

  4. Hi SS Forums,

     

    I'm having trouble locating any online documentation for customization of portfolio-text (captions) beyond just basic text styling.

     

    My goal is to create a pill-shaped box (similar to one of my button styles - not pictured), around the portfolio-text on my portfolio thumbnails, seen below in the screenshot.

    Screenshot 2024-03-19 at 1.11.25 PM.png

  5. @tuanphan thank you for providing these workarounds. I'm finishing this work now and having some trouble with SS only linking the first page as all the other pages, despite having the appropriate URL for each page placed exactly where you instructed. Here's my code, and the page. 

     

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
    <script>
    $(document).ready(function() {
        $('[data-section-id="640244300a0dcf4d23913a59"] a.portfolio-hover-item:nth-child(1)').attr('href','https://www.grahamcerceo.com/brand-refinement');
        $('[data-section-id="640244300a0dcf4d23913a59"] a.portfolio-hover-item:nth-child(2)').attr('href','https://www.grahamcerceo.com/brokermint-baddies');
        $('[data-section-id="640244300a0dcf4d23913a59"] a.portfolio-hover-item:nth-child(3)').attr('href','https://www.grahamcerceo.com/in-house-video');
      $('[data-section-id="640244300a0dcf4d23913a59"] a.portfolio-hover-item:nth-child(4)').attr('href','https://www.grahamcerceo.com/customer-stories');
      $('[data-section-id="640244300a0dcf4d23913a59"] a.portfolio-hover-item:nth-child(5)').attr('href','https://www.grahamcerceo.com/how-it-works-refresh');
    });
    </script>

     

    https://www.grahamcerceo.com/portfolio-test

×
×
  • 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.