imdanielduncan Posted February 8 Share Posted February 8 Site URL: imdanielduncan.com Hi, I was wondering if there is any way I can create a "Slide up button on hover" effect in Squarespace like the one on https://www.mous.co/. A drop shadow on hover along with the slide up animation would be nice, but is not necessary. I am on version 7.1 and have the Personal Plan. Thanks! Link to comment
Mdhanjal Posted February 8 Share Posted February 8 @media (hover: hover) .primary-button-style-outline .sqs-button-element--primary:hover, .primary-button-style-outline .sqs-button-element--primary.comment-btn:hover, .primary-button-style-outline .sqs-modal-lightbox .sqs-modal-lightbox-content .sqs-button-element--primary:hover, .primary-button-style-outline div#Tock_widget_container>div.TockWidgetWrapper .TockButton-blue.sqs-button-element--primary:hover { background: var(--primaryButtonBackgroundColor); color: var(--primaryButtonTextColor); box-shadow: 0 2px 20px rgb(0 0 0 / 20%); } littel bit help for hover shodow Hi, I'm BITTU. A website developer with 10 years experience with Squarespace. if you need help and work with me email me here :- mandeepsquarespace@gmail.com Website:- dhanjalsolution.com Best Hourly Rate :- $15 Per Hour Link to comment
imdanielduncan Posted February 8 Author Share Posted February 8 13 hours ago, Mdhanjal said: @media (hover: hover) .primary-button-style-outline .sqs-button-element--primary:hover, .primary-button-style-outline .sqs-button-element--primary.comment-btn:hover, .primary-button-style-outline .sqs-modal-lightbox .sqs-modal-lightbox-content .sqs-button-element--primary:hover, .primary-button-style-outline div#Tock_widget_container>div.TockWidgetWrapper .TockButton-blue.sqs-button-element--primary:hover { background: var(--primaryButtonBackgroundColor); color: var(--primaryButtonTextColor); box-shadow: 0 2px 20px rgb(0 0 0 / 20%); } littel bit help for hover shodow I put this code in the Custom CSS section and it said "Syntax Error on line 1" Link to comment
Mdhanjal Posted February 9 Share Posted February 9 .primary-button-style-outline .sqs-button-element--primary:hover, .primary-button-style-outline .sqs-button-element--primary.comment-btn:hover, .primary-button-style-outline .sqs-modal-lightbox .sqs-modal-lightbox-content .sqs-button-element--primary:hover, .primary-button-style-outline div#Tock_widget_container>div.TockWidgetWrapper .TockButton-blue.sqs-button-element--primary:hover { background: var(--primaryButtonBackgroundColor); color: var(--primaryButtonTextColor); box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; } Hi, I'm BITTU. A website developer with 10 years experience with Squarespace. if you need help and work with me email me here :- mandeepsquarespace@gmail.com Website:- dhanjalsolution.com Best Hourly Rate :- $15 Per Hour Link to comment
imdanielduncan Posted February 9 Author Share Posted February 9 12 minutes ago, Mdhanjal said: .primary-button-style-outline .sqs-button-element--primary:hover, .primary-button-style-outline .sqs-button-element--primary.comment-btn:hover, .primary-button-style-outline .sqs-modal-lightbox .sqs-modal-lightbox-content .sqs-button-element--primary:hover, .primary-button-style-outline div#Tock_widget_container>div.TockWidgetWrapper .TockButton-blue.sqs-button-element--primary:hover { background: var(--primaryButtonBackgroundColor); color: var(--primaryButtonTextColor); box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; } Awesome! That worked, thanks! Do you know if there is any way to have the button slide up on hover as well? Or is that not possible Link to comment
Mdhanjal Posted February 10 Share Posted February 10 On 2/9/2023 at 7:55 AM, imdanielduncan said: Awesome! That worked, thanks! Do you know if there is any way to have the button slide up on hover as well? Or is that not possible thank you Hi, I'm BITTU. A website developer with 10 years experience with Squarespace. if you need help and work with me email me here :- mandeepsquarespace@gmail.com Website:- dhanjalsolution.com Best Hourly Rate :- $15 Per Hour Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment