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.
Hi, please share your store url so I can provide solution
your site is password protected, share the pass here or by PM please
password: aoniye
Hi, seems that each product has a product slider…
I would need access to the code to check how this is done in the Streamline Theme as i am not familiar with this theme’s codebase.
would it be ok to request collaborator access to your store?
Hi, yes please.
Ok, before I take a look, I see what the theme does is it loops through all the product images while you place the mouse over a product. So really, on mouse-over it is not the alternative image that appears as you said, but all the images in sequence.
For example, in your CONTOUR SCRUNCH SEAMLESS LEGGINGS - PINK product, when I do mouse-over i get 3 images on a loop:
Is this what you want but quicker? or you only want to show the alternate image (second image) on mouse-over?
Hi,
I am sorry if I was not clear enough, let me rephrase my question:
Would it be possible to:
&
Thanks.
Thanks @Marvist for the detailed explanation. I have requested access to take a look.
Removing the line is really easy. Lets see about speeding up the looping on the images
Super!
I have now granted access.
Great, will try to implement a fix sometime tomorrow
Thanks for your help so far. Much appreciated.
If you have time, there is another thing. I have for some time tried to change the code so I can include icons to the announcement bar, without any luck.
I have tried to follow instructions written by another Shopify partner for the debut theme, but the code seems to be very different in Streamline.. I cannot find the section named: "
"announcement-bar__message""
Is there an easy way to do this in Streamline theme?
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.
I can see that the progress bar is gone, and the speed of the loop is now perfect.
Thank you so much.
Nice to hear,
To make live the changes I made, you can either:
Good luck with your store!
Thanks again for all the help!
I have a similar issue. I changed the code so the hover only shows the 2nd image, but it constantly loops through the first and second images and I want it to only loop the 2nd image (gif) on hover. Any help is greatly appreciated, thank you! https://video-milkshake.myshopify.com/
Can you share how you did that - where it only flashes between the first two images
Can you share how to make the images loop faster too 