Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Help with Slideshow Gallery for mobile


Recommended Posts

  • Replies 70
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Popular Posts

/* resize home mobile slideshow */ @media screen and (max-width:767px) { .homepage .gallery-fullscreen-slideshow[data-width="full-bleed"] { height: 40vh !important; } .homepage .gallery-fullscreen

Add to Home > Design > Custom CSS /* resize home slide */ @media screen and (max-width:640px) { section#p2p-home img { width: 100% !important; left: 0 !important; height: auto !i

Add to Design > Custom CSS @media screen and (max-width:767px) { body.homepage .gallery-fullscreen-slideshow { height: 30vh !important; } }  

Posted Images

13 hours ago, Feldborg said:

Hi @tuanphan

I have tried to do all the aforementioned solutions you have written - but my slideshow on the homepage still wont fit properly. I use Slideshow: Full and when I'm looking on a phone, the images are not resized properly - can you please help me. I have now turned off auto-play.

https://www.smusicsupervision.com/

Add to Design > Custom CSS

@media screen and (max-width:767px) {
body.homepage .gallery-fullscreen-slideshow {
    height: 30vh !important;
}
}

 

Link to post

I'm trying to do the same thing as the OP if anyone can help - would love the slideshow gallery on this page to fill the screen vertically when viewed on mobile.

https://beccagleason.co/weddings

Also is the code for that kind of thing something I can just copy for different galleries or is it specific for each slideshow? 

Link to post
On 2/17/2021 at 9:02 PM, Elena2004 said:

Thank You so much for the information but i am getting a problem when i add slide show to my home page my page speed decreases badly can any one help me in that Site URL: https://www.startmyhouse.com

Can you check url again? It is WordPress site.

On 2/20/2021 at 3:20 AM, rebeccagleasonphotography said:

I'm trying to do the same thing as the OP if anyone can help - would love the slideshow gallery on this page to fill the screen vertically when viewed on mobile.

https://beccagleason.co/weddings

Also is the code for that kind of thing something I can just copy for different galleries or is it specific for each slideshow? 

Looks fine here. Did you solve this?

Link to post
On 2/16/2021 at 9:52 AM, tuanphan said:

Add to Design > Custom CSS


@media screen and (max-width:767px) {
body.homepage .gallery-fullscreen-slideshow {
    height: 30vh !important;
}
}

 

Thanks you so much! 🙏

Link to post
  • 2 weeks later...

Hi, 

I am currently having trouble with the spacing between this slideshow and the next section as its too big. as shown by the picture below. I also can't get the "shop now" button to move down in the mobile view and is covering the image. do you think you could help me?

....PNG

Link to post
On 3/6/2021 at 8:35 AM, snuggs said:

Hi, 

I am currently having trouble with the spacing between this slideshow and the next section as its too big. as shown by the picture below. I also can't get the "shop now" button to move down in the mobile view and is covering the image. do you think you could help me?

....PNG

Can you share site url?

Link to post

Hi @tuanphan

I have tried to apply the codes you've written above but still, the slideshow on our website still being cropped severely on the mobile... How can we make it fit properly to show images in full width on mobile? I guess our problem is similar to the one you've solved above in October 2, 2020 (below screenshot)

Our website: https://www.modernfanasia.com/

1543304515_2021-03-1511_36_32.thumb.png.075342d9fbebe899a321817eaa08e94a.png

Please help, thank you in advance!

Link to post
  • 2 weeks later...
On 3/15/2021 at 10:39 AM, TWII529 said:

Hi @tuanphan

I have tried to apply the codes you've written above but still, the slideshow on our website still being cropped severely on the mobile... How can we make it fit properly to show images in full width on mobile? I guess our problem is similar to the one you've solved above in October 2, 2020 (below screenshot)

Our website: https://www.modernfanasia.com/

1543304515_2021-03-1511_36_32.thumb.png.075342d9fbebe899a321817eaa08e94a.png

Please help, thank you in advance!

Hi. Can you share link to your site?

Link to post
  • 3 weeks later...
On 3/29/2021 at 11:40 AM, TWII529 said:

Hi. Add to Design > Custom CSS

/* resize mobile slideshow */
@media screen and (max-width:640px) {
section#home-banner img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
}
section#home-banner {
    min-height: unset !important;
    height: 200px !important;
}
}

 

Link to post
12 hours ago, Klaudia said:

Hi @tuanphan I have similar problem, tried suggested code here it didn't work.

 

My website: https://www.sonaskids.com/

Thank you!

Add to Design > Custom CSS

/* resize mobile slideshow */
@media screen and (max-width:767px) {
.gallery-fullscreen-slideshow {
    height: 35vh !important;
}
}

 

Link to post
On 4/17/2021 at 5:06 PM, tuanphan said:

Hi. Add to Design > Custom CSS


/* resize mobile slideshow */
@media screen and (max-width:640px) {
section#home-banner img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
}
section#home-banner {
    min-height: unset !important;
    height: 200px !important;
}
}

 

Hi @tuanphan it works, thanks a lot!

Link to post

Hi, I've tried all the codes you've mentioned in the CSS of my website, but I am still getting so much white space around my banner/slider thing when I go to my mobile site.  I don't know if maybe it's my set up?

image.thumb.png.4f72cb7c3a8903e7124cb223a635ab9c.png

My web address is www.evdarcy.com.

I would be ever so grateful if you were able to shine a little light on what I'm doing wrong or advise how to fix it?

Many thanks in advance!

Link to post
On 4/25/2021 at 6:18 PM, evdarcy said:

Hi, I've tried all the codes you've mentioned in the CSS of my website, but I am still getting so much white space around my banner/slider thing when I go to my mobile site.  I don't know if maybe it's my set up?

My web address is www.evdarcy.com.

I would be ever so grateful if you were able to shine a little light on what I'm doing wrong or advise how to fix it?

Many thanks in advance!

Add to Design > Custom CSS

/* Mobile slide white spacing */
@media screen and (max-width:640px) {
section#news-slider {
    min-height: unset !important;
}
}

 

Link to post

Create an account or sign in to comment

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


×
×
  • Create New...