carousel radio buttons

Question

carousel radio buttons

Navigation

#1 by (0 votes)

0

I'm using the owl-carousel 2.0.0 plugin, to make a carousel of product packaging images that are selectable, via an input radio, only one carton should be selected, the structure of this carousel is as follows, container is a <label> and inside it has the input[type=radio] and the product image <img> when clicking the carousel item, which in this case is the label, it changes the state of the input radio to checked, I want to get this event and add a class to the label whenever this radio input is checked, and when I select another radio button it removes the class from the other item and adds it to the current one.

I made a small script but currently it does not do well what I want, when I select another radio it keeps the class in the previous label, maybe it is my logic that is wrong. follow script:

link

javascript html jquery css owl-carousel

asked by anonymous 23.09.2015 / 17:09

1 answer

Retrieving javascript combobox value How to enable WooCommerce Sidebar?

score 0 · Answer 1

Try to remove the class from all labels before. This should work:

$('input[name=pack]').on('click', function() {
   $('.owl-item').find('.product').removeClass('active');
   if( $(this).is(':checked') ) {
      $(this).parent().addClass('active');
   }
});