Порядок сортировки

[cloudrc]

Доброго времени суток!

В Хитах Продаж на Главной имею такую структуру:

<div>
<div id="rear-side-hits">
	   <div><a href="<?php echo $product['href']; ?>"></a></div>
	   <div class="name"><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a></div>
	   <?php echo $product['upc']; ?>
	   <div id="short-dis"><?php echo $product['description']; ?></div>
           <?php if ($product['price']) { ?>
           <div class="price">
          <?php if (!$product['special']) { ?>
          <?php echo $product['price']; ?>
          <?php } else { ?>
          <span class="price-old"><?php echo $product['price']; ?></span> <span class="price-new"><?php echo $product['special']; ?></span>
          <?php } ?>
        </div>
          <?php } ?>
</div>
	  
<div id="front-side-hits">
	     <?php if ($product['thumb']) { ?>
       <div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" /></a></div>
         <?php } ?>
</div>
</div>

Стили:

.box-product-hits > div {
width: 245px;
display: inline-block;
vertical-align: top;
float: left;
background: #fff;
}
#rear-side-hits {
position: absolute;
width: 245px;
height: 343px;
text-align: left;
background: rgba(0, 0, 0, 0.5) none repeat scroll 0% 0% !important;
opacity:0;
transition: all 0.3s ease-in-out 0s;
}
.box-product-hits > div:hover #rear-side-hits {
opacity:1;
}

При на ведении на товар убирается прозрачность с div'ом, в котором название, цена и т.д.

Но как мне сделать, чтобы картинка, которая находится в rear-side-hits, сохраняла в себе кликабельность ссылки?

 

Только с помощью z-index возможно сделать?

 

Ссылка: th-ecrat-er.tmweb.ru (без тире)

Змінено 6 липня 2015 користувачем cloudrc