|
Сообщение от Сергей Ракипов
|
|
Да все как вы и обещали, счастье случилось ) спасибо
|
Оно же практически не работает!
Сергей Ракипов, решение, работающее на всех устройствах, т. е. готовое для production...
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
.block {
height: 100%;
background-color: #54CC2C;
position: relative;
}
.block_inside1 {
cursor: pointer;
background-color: #CC2ABC;
}
.block_inside2 {
position: relative;
width: 50px;
transform: translateY(-250px);
transition: transform .5s 300ms;
z-index: 2;
background-color: #e2e2e2;
}
.block_inside1:hover ~ .block_inside2,
.block_inside1:focus ~ .block_inside2,
.block_inside2:hover,
.block_inside2:focus-within {
transform: translateY(20px);
}
</style>
</head>
<body>
<div class="block">
<div class="block_inside1" tabindex="0">test</div>
<div class="block_inside2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis, maiores!</div>
</div>
</body>
</html>
И пожалуйста откажитесь от своей вредной идей, что сайты должны работать только при помощи мышки! (И очевидно только на Windows!)