Skip to main content
Known Participant
April 19, 2024
Answered

adding images to a carousel with thumbnails

  • April 19, 2024
  • 1 reply
  • 5020 views

Hi again, everybody! I've been working on this for days; it's time to call on the experts!

I have a couple of issues. This works...

https://www.greenbeaks.com/thumbnail-carousel.html

This doesn't. It jumps, and I don't why. Also, I have <div> issues.

https://www.greenbeaks.com/aviary-australian.html

Ultimately, I have a total of 36 slides that I'd like contained in one carousel. Of the dozens of ways I've tried to make it happen, none have been successful. tia

 

This topic has been closed for replies.
Correct answer BenPleysier

Thanks, Ben. This is what I did... https://www.greenbeaks.com/aviary.html

This is so much better. I like the smaller thumbnails, but I do wish the carousel were a bit larger. It's tiny when viewed on a phone.


quote

Thanks, Ben. This is what I did... https://www.greenbeaks.com/aviary.html

This is so much better. I like the smaller thumbnails, but I do wish the carousel were a bit larger. It's tiny when viewed on a phone.


By @Haybound23605476

 

Change the line 

 

 

<div class="col-8 offset-2">

 

 

to 

 

 

<div class="col col-md-8 offset-md-2">

 

 

If you want to know more, see the Bootstrap documentation.

Don't forget to change all images to WebP.

 

1 reply

Nancy OShea
Adobe Expert
April 19, 2024

Code errors effect performance.

Fix these code warnings & errors first: 

https://validator.w3.org/nu/?doc=https%3A%2F%2Fwww.greenbeaks.com%2Faviary-australian.html

 

If after code errors are corrected you still need help, come back & we'll take another look.

 

Nancy O'Shea— Product User, Community Expert &amp; Moderator
Known Participant
April 19, 2024

Thanks, Nancy. I did these and it did nothing to correct the problem I'm having.

Nancy OShea
Adobe Expert
April 19, 2024

It seems to be working now. Refresh your page in browser (Ctrl + R or Ctrl + F5).

 

 

 

Nancy O'Shea— Product User, Community Expert &amp; Moderator