CODEWITHSUNDEEP
javascriptwoocommerceflexslider
bkseen
bkseen

Reputation: 389

Woocommerce 3.x image swap "On Hover" thumbs

A bit struggling with it I would like to ask the help of my stack fellows.

Single Product page: Does anyone know a trick to change the "on click" event an "on hover + on click (for a responsive purpose)" on the Thumbnails?

I know it's a recurrent question but it looks like it has been deprecated since de 3.0 of WooCommerce.

Looks like I have to change the function in FlexSlider js but I couldn't find the location of this one.

I am using "Atelier theme" if it can help.

Also find my website there: https://unisashoes.com.au/product/wikera-ks/

Cheers

Upvotes: 1

Views: 670

Answers (1)

bkseen
bkseen

Reputation: 389

I Finally figure it out with simply trigger the click event on the li when hovered.

I've also added a jQuery(document).ready(function($) { because of the use jQuery.noConflict(); If not, $ is undefined.

jQuery(document).ready(function($) {
    $(window).load(function() {
      $('.flexslider').flexslider({
        animation: "slide",
        controlNav: "thumbnails",
        start: function (){
        }
      });

      $(".flex-control-thumbs li img").hover(function(){
        $(this).click();
      });
    });
});

Upvotes: 2

Related Questions