столь глупый вопрос, но я не понимаю если есть движение по x (с права на лево) и y ( с низу в верх) как сделать что бы текст выдвигался с левой стороны, я только учусь анимациям а в интернете особо такого ничего не нашёл.
Это то, как я понял заданный вопрос))
.wrapper {
background-color: grey;
display: block;
width: 300px;
height: 100px;
padding: 5px;
overflow: hidden;
position: absolute;
bottom: 0;
right: 0;
animation: movement 3s 1s forwards;
}
p {
color: white;
font-size: 18px;
text-indent: -1000px;
animation: movementText 3s 1s forwards;
}
@keyframes movement {
from {
bottom: 0;
right: 0;
}
to {
bottom: calc(100% - 110px);
right: calc(100% - 310px);
}
}
@keyframes movementText {
from {
text-indent: -1000px;
}
to {
text-indent: 0;
}
}<div class="wrapper">
<p>Текст выезжающий слева</p>
</div>Можно использовать маргин, можно падинг, можно через left, top... Тут смотреть надо на общий код смотря куда ставим :) Но вот пример на то что бы он приехал справа к нам.
@keyframes uvilichenie {
0% {
margin-left: 300px;
}
100%{
margin-left: 0px;
}
}