Jump to content

Mobile view only: Full Width Slideshow.

Recommended Posts

portfolio-new.squarespace.com

Passcode: port

Hi, I have been trying to play around squarespace and trying to stylize this slide show gallery. Where I would like a regular slideshow on the desktop version, but on mobile version, I would like to hide the navigation arrow control, and make my image full width. I have been playing with the setting but out of luck. 

Below was what I used to remove the control arrow, 

/* Remove gallery slideshow arrows */
@media screen and (max-width:767px) {
.gallery-slideshow-control {
       visibility: hidden;
}
}

Here is the css I wrote for full-width slideshow, but didn't work... 

@media screen and (max-width: 767px) {
  .gallery-slideshow[data-width="full-bleed"] {
  width:100% !important;
  height: auto !important}
}

 

Thank you and much appreciated with any thoughts and suggestions. 

Screen Shot 2022-11-13 at 8.10.09 PM.png

Edited by Clindes
Link to comment
  • Replies 3
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

On 11/29/2022 at 3:42 AM, Clindes said:

Hey @tuanphan I think with the fix, the mobile version doesn't work smoothly. 😞 

 

Can you check site url again? It doesn't work now

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

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