Streamline Theme - Collection Grid/ Collection page - hover effect

Marvist · ‎01-24-2021

Hi

When mouse over the image in the collection as illustrated below, an underline appears which runs from left to right, while at the same time alternate product image appears slow-mo.

How can I remove this "running underline" and simultaneously increase the speed of the alternate product image?

Thanks for your attention.

PeanutButter · ‎01-25-2021

Hi @Marvist,

I have made a copy of your theme and named it Streamline By Peanuts. There I have implemented both changes related to the product slider:

1- Remove the progress bar:

This was accomplished by adding this add the end of Assets/theme.css.liquid:

/*************************************************/
/*** customizations by https://peanutbutter.es ***/
/*************************************************/

/* Hide product slide progresion bar */
.product-slider.slick-initialized:after {
  display: none;
}

2- Make the loop through images quicker

By default the time spent on each slide is set to 1050ms (a little above 1 second). I have set this to 750ms (about 3 quarters of the default). Let me know what you think about the current speed.

Peanut Butter Collective | Shopify Experts
- Was my reply helpful? Please Like and Accept Solution.
- Want to customize and improve your store? Hire us.
- Feel free to contact me us hello@peanutbutter.es

View solution in original post

Streamline Theme - Collection Grid/ Collection page - hover effect

Community Blog Articles

Shopify Community

Support

Shopify

Quick Links