Enlarging Second Product Image and Scrolling for Images

[KimGottwald]

Hi everyone,

I’m looking to make some adjustments to the product image display on my store. Specifically, I’d like to enlarge the second product image, and I want to enable a vertical scroll for navigating between images. Ideally, this would allow users to scroll through images up and down without shifting the selection options on the right side of the page.

Here’s the preview link to my store: https://www.rappid.run/collections/frontpage
Password: Password

Thank you in advance for any guidance!

Best,
Kim

[Abdosamer]

@KimGottwald , go to base.css and add the following code :

@media (min-width:900px){
  .product--stacked .product__media-item {
   max-width:100%; !important
}

}

[KimGottwald]

Thank you! But is there a way to also fixate the selection on the right side while scrolling?

[Abdosamer]

@KimGottwald , go to section-main-product.css and add the following code :

@media(min-width:900px){
.product__info-wrapper.grid__item {
    position: sticky;
    top: 0;
    right: 0;
    height:70%;
}

}

[KimGottwald]

Thank you so much! The only little problem left is that the product title is not visible when scrolling, is this fixable?