Выбор опции цвет в картинках

[helen2014]

Здравствуйте!

 

Нужна помощь, сделал вывод опций картинок горизонтально в ряд. Сам код нашел на просторах интернета, так вроде бы все нормально, но при выборе цвета изображение не становиться активным. Сам выбор срабатывает! Подскажите, как сделать, чтобы при выборе картинка становилась активной.

 

Вот часть кода связанная с картинками:

 <b>Выберите цвет:</b><br />
          <table class="option-image">
             <?php foreach ($option['option_value'] as $option_value) { ?>
              <tr class="tr_my_options">
             <td style="width: 1px; display: none;"><input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /></td>
 <td><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" /></label></td>
 <td><label class="name_my_options" for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><!--<?php echo $option_value['name']; ?>-->
 <?php if ($option_value['price']) { ?>
 (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
                  <?php } ?>

CSS:

.product-info .option-image {
 margin-top: 3px;
 margin-bottom: 10px;
}
.product-info .option-image .tr_my_options {
    float: left;
    margin-bottom: 0;
    margin-right: 10px;
    position: relative;
    width: 50px;
}
.product-info .option-image .tr_my_options label {
    border: 0.5px solid #f9e5d2;
    display: block;
    height: 71px;
    width: 50px;
    -webkit-border-radius: 0px 0px 0px 0px;
 -moz-border-radius: 0px 0px 0px 0px;
 -khtml-border-radius: 0px 0px 0px 0px;
 border-radius: 0px 0px 0px 0px;
 
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
.product-info .option-image .tr_my_options label:hover {
    border: 0.5px solid #990000;
}

.product-info .option-image .tr_my_options img {
    border: none;
    cursor: pointer;
    margin-right: 5px;
}
.product-info .option-image .name_my_options {
    left: 3px;
    position: absolute;
    right: 10px;
    text-align: center;
    top: 3px;
}
.product-info .option-image label {
 display: block;
 width: 100%;
 height: 100%;
}
.product-info .option-image img {
 margin-right: 5px;
 border: 1px solid #CCCCCC;
 cursor: pointer;
}

[Tom]

http://tom.ip64.net/vq-mod-v-tovare/opcii-ekstra-v-stile-aliexpress.html

[helen2014]

http://tom.ip64.net/vq-mod-v-tovare/opcii-ekstra-v-stile-aliexpress.html

 

Я так понимаю это сделано в виде модуля? Где и как его можно приобрести?

[Tom]

У меня))))

[helen2014]

У меня))))

 

Хорошо, сейчас договоримся! И еще вопрос по опциям цвета и размера (как у Вас на демке), изменения цены при выборе цвета и размера связаны в этом модуле? или это что-то другое?

[Tom]

Всё вместе.Как шампунь-кондиционер с эффектом отвыкания от курения))))

[helen2014]

Всё вместе.Как шампунь-кондиционер с эффектом отвыкания от курения))))

 

Хорошо, тогда пишите в личку, что, сколько и куда?

[Tom]

Давно уже стою в личке с сачком.

[Allaur]

Всё вместе.Как шампунь-кондиционер с эффектом отвыкания от курения))))

Опции экстра (в стиле Aliexpress)

Об этом речь?

Приобрести на той же странице можно?

[Tom]

Нет.Там демка о которой я давным давно уже и забыл.

[Allaur]

Вот так всегда, как только найдёшь что нибудь новое, так сразу  это новое уже давно забытое старое ))

[Allaur]

а как бы этот модуль приобрести для версии Ocstore 15512 ?

[Tom]

Так же как и написано выше .У меня в личке....