Search the Community

Здарова всем. Написал вот такой вот кодик: <!--Начало блока--> <div class="item-block"> <div class="item-block-img"> <a href=""> <img src="https://www.vivatao.com/taoimages/img04/bao/uploaded/i4/T1a7tSXuhbXXXXXXXX_!!0-item_pic.jpg_200x200.jpg" alt=""> </a> </div> <div class="item-block-title"> <a href="">фыв</a> </div> <div class="item-block-price"> <a href="">55 268 дол</a> </div> <div class="item-block-price2"> <a href="">Перейти к товару</a> </div> </div> <!--Конец блока--> у него вот такой вот css [CSS].item-block { overflow: hidden; float: left; width: 23%; border: 1px solid #C9CBCD; padding: 5px; margin: 0 2% 2% 0; } .item-block:hover { border: 1px solid #c0392b; } .item-block-img { overflow: hidden; } .item-block-img img { width: 100%; height: 150px; } .item-block-title { text-align: center; margin: 2px 0; height: 40px; } .item-block-title a { text-decoration: underline; display: block; color: #3d74aa; } .item-block:hover > .item-block-title a { color: #c0392b; } .item-block-desc { overflow: hidden; text-align: center; margin: 2px 0; height: 40px; } .item-block-price { overflow: hidden; } .item-block-price a { background: #5aa8d1; background: -moz-linear-gradient(top, #5aa8d1 0%, #2493c3 50%, #3d74aa 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5aa8d1), color-stop(50%,#2493c3), color-stop(100%,#3d74aa)); background: -webkit-linear-gradient(top, #5aa8d1 0%,#2493c3 50%,#3d74aa 100%); background: -o-linear-gradient(top, #5aa8d1 0%,#2493c3 50%,#3d74aa 100%); background: -ms-linear-gradient(top, #5aa8d1 0%,#2493c3 50%,#3d74aa 100%); background: linear-gradient(to bottom, #5aa8d1 0%,#2493c3 50%,#3d74aa 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5aa8d1', endColorstr='#3d74aa',GradientType=0 ); color: #fff; padding: 5px; border-bottom: 3px solid #225688; text-align: center; display: block; } .item-block-price2 { overflow: hidden; } .item-block-price2 a { background: #5aa8d1; background: -moz-linear-gradient(top, #5aa8d1 0%, #2493c3 50%, #3d74aa 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5aa8d1), color-stop(50%,#2493c3), color-stop(100%,#3d74aa)); background: -webkit-linear-gradient(top, #5aa8d1 0%,#2493c3 50%,#3d74aa 100%); background: -o-linear-gradient(top, #5aa8d1 0%,#2493c3 50%,#3d74aa 100%); background: -ms-linear-gradient(top, #5aa8d1 0%,#2493c3 50%,#3d74aa 100%); background: linear-gradient(to bottom, #5aa8d1 0%,#2493c3 50%,#3d74aa 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5aa8d1', endColorstr='#3d74aa',GradientType=0 ); color: #fff; padding: 5px; border-bottom: 3px solid #225688; text-align: center; text-decoration: none; display: none; } .item-block:hover > .item-block-price { display: none; } .item-block:hover > .item-block-price2 a { background: #f68410; background: -moz-linear-gradient(top, #f68410 0%, #C87827 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f68410), color-stop(100%,#C87827)); background: -webkit-linear-gradient(top, #f68410 0%,#C87827 100%); background: -o-linear-gradient(top, #f68410 0%,#C87827 100%); background: -ms-linear-gradient(top, #f68410 0%,#C87827 100%); background: linear-gradient(to bottom, #f68410 0%,#C87827 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f68410', endColorstr='#C87827',GradientType=0 ); display: block; border-bottom: 3px solid #a75d12; }[/CSS] как сделать что бы при наведении кнопка перейти к товару появлялась плавно и исчезала плавно? Всем спс