Jump to content

Need to replace first slide background in a gallery slideshow reel with different image on mobile

By ryanbrinkerhoff, in Customize with code

Go to solution Solved by Lesum,

Recommended Posts

ryanbrinkerhoff Level 5

ryanbrinkerhoff

Posted
Posted

Trying this but it is not working. It hides all images in the slideshow. Once I figure out how to address JUST this first image, I will be able to figure this out! Thanks for the help.

  /* Hide first slide */
  section[data-section-id="64d029396c94d354c575f3ed"] .list-slideshow-image:first-child {
  display: none !important;
}
 

 

Link to comment
  • Replies 6
  • Views 1k
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Popular Posts

Lesum
Lesum

Hi, Could you please remove your previous code and try this one? @media only screen and (max-width: 640px) { section[data-section-id="64d029396c94d354c575f3ed"] .user-items-list-banner-slideshow .

Lesum
Lesum

Hi, Would it be possible to share the website URL and link to the image that you would use on mobile?

ryanbrinkerhoff
ryanbrinkerhoff

Perfect! Thanks a bunch! - Ryan

  • Solution
Lesum Level 9

Lesum

Posted
  • Solution
Posted

Hi, Could you please remove your previous code and try this one? 

@media only screen and (max-width: 640px) {
	section[data-section-id="64d029396c94d354c575f3ed"] .user-items-list-banner-slideshow .slides .slide:nth-child(1) .list-slideshow-image {
  		display: none !important;
	}
	section[data-section-id="64d029396c94d354c575f3ed"] .user-items-list-banner-slideshow .slides .slide:nth-child(1) .slide-media-container {
  		background: url("https://images.squarespace-cdn.com/content/v1/62b0db0c1be03b40824ca350/280dedfe-32a9-46c7-b179-2931011786e4/GRDM_logo_pres_final.jpg") !important;
  		background-size: cover !important;
  		background-repeat: no-repeat !important;
  		background-position: center !important;
	}
}

Let me know how it goes. Thanks!

If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. 

Sam
Web Developer & Digital Designer
☕ Did you find my contribution helpful? Buy me a coffee?

Link to comment

Create an account or sign in to comment

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

Sign Up / Login
Go to topic listing

News

×
×
  • Create New...

Squarespace Webinars

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

Upcoming Webinars →

Hire a Designer

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

Get Matched →

Support

Community

Developers

Resources