Ребята, подскажите,пожалуйста в чём проблема. Прописала код для увеличения изображений опций при наведении курсора в product.tpl и в css. Но видимо этого недостаточно, так как изображение не хочет увеличиваться... Или в где-то ошибка... Вот эти фрагменты кода
product.tpl
<?php if ($option['type'] == 'radio') { ?>
<div class="col-xs-12 col-md-12 col-sm-12 col-lg-12"><h3><?php echo $option['name']; ?></h3></div>
<div class="form-group<?php echo ($option['required'] ? ' required' : ''); ?>">
<div id="input-option<?php echo $option['product_option_id']; ?>">
<?php foreach ($option['product_option_value'] as $option_value) { ?>
<div class="col-xs-4 col-md-2 col-sm-2 col-lg-2">
<div class="radio">
<label>
<?php if ($option_value['image']) { ?>
<input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>"/>
<div class="imgbighidden"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" class="img-thumbnail" /></div>
<div class="imghidden"><img src="<?php echo $option_value['image']; ?>" width="100%" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" class="img-thumbnail" /></div>
<?php } ?>
<?php echo $option_value['name']; ?>
<?php if ($option_value['price']) { ?>
(<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
<?php } ?>
</label>
</div>
</div>
<?php } ?>
</div>
</div>
<?php } ?>
СSS
.img-thumbnail {
display: inline-block;
overflow:hidden;
max-width: 100%;
height: auto;
padding: 4px;
line-height: 1.42857143;
background-color: #fff;
border: 0px solid #ddd;
border-radius: 4px;
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.imghidden{
overflow: hidden;
cursor: pointer;
height: 50px;
width: 130px;
Вот такое вот я вижу(
border-radius: 4px;
}
.imgbighidden{
cursor:pointer;
display: none;
position: absolute;
bottom: 70px;
right: -30px;
border-radius: 4px;
box-shadow: 2px 0px 14px #000;
z-index: 10;
}
.imgbighidden img{
border-radius: 4px;
}
.img-thumbnail:hover .
imgbighidden{display: block;
}