<a href="#win3" title="<?=($in_corzina)?"Товар уже в корзине":"Добавить в корзину"?>" class="add_tovar<?=($in_corzina)?" active":""?>"><div class="vkorziny anim">Добавить в корзину</div></a><a href="#win3">Открыть окно</a>, всплывает окно.
.tooltip:before,
.tooltip:after {
display: block;
position: absolute;
visibility: hidden;
opacity: 0;
margin-bottom: 15px;
-webkit-transition: opacity .7s, margin-bottom .7s;
transition: opacity .7s, margin-bottom .7s;
left: 50%;
z-index: 9999;
}
.tooltip {
position: relative;
}
.tooltip:before {
bottom: 25px;
left: 50%;
padding: 5px 5px 9px 5px;
width: 150px;
margin-left: -75px;
color: #fff;
line-height: 15px;
background-color: #202020;
content: attr(data-title);
border-radius: 2px;
-webkit-box-shadow: border-box;
box-shadow: border-box;
text-align: center;
-moz-filter: drop-shadow(0px 5px 4px rgba(50, 50, 50, 0.30));
-webkit-filter: drop-shadow(0px 5px 4px rgba(50, 50, 50, 0.30));
filter: drop-shadow(0px 5px 4px rgba(50, 50, 50, 0.30));
}
.tooltip:after {
content: "";
border-top: 10px solid #202020;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
bottom: 15px;
margin-left: -10px;
-moz-filter: drop-shadow(0px 5px 4px rgba(50, 50, 50, 0.30));
-webkit-filter: drop-shadow(0px 5px 4px rgba(50, 50, 50, 0.30));
filter: drop-shadow(0px 5px 4px rgba(50, 50, 50, 0.30));
}
.tooltip:hover:before,
.tooltip:hover:after {
opacity: 1;
margin-bottom: 0;
visibility: visible;
}