Как реализовать подобное?
Доброго дня!
По этой ссылке примерно посередине страницы есть блок "ABOUT COMPANY". Там фон черного цвета и аннимирован, как бегущая строка. Если посмотреть через средства разработчика браузера, то там видно, что свойство background-position непрерывно меняется, что собственно и создает аннимацию. Хочу так же сделать на своем сайте. Подскажите, как это реализовать технически? |
Цитата:
http://blog.kislenko.net/show.php?id=1796 Ну и еще много всякого... https://yandex.ru/search/?text=Javas...r=38&clid=9582 |
background-image moving infinite
Цитата:
есть способ проще css ... (картинку и время анимации сами уточните)
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
div.bg-moving{
height: 80vh;
width: 80vw;
background-color: #141414;
background-image: url(https://krot.mobi/uploads/posts/2020-01/1579337847_21-92.png);
background-repeat: repeat;
margin: 20px auto;
animation: moving 15s linear infinite;
background-size: 20vw 48vh;
background-position-x: 0;
animation-direction: inherit;
}
@keyframes moving{
to {
background-position-x: -100%;
}
}
</style>
</head>
<body>
<div class="bg-moving"></div>
</body>
</html>
|
г-н Рони!
Спасибо! Действительно, ваше решение лучшее!!!! :dance: |
| Часовой пояс GMT +3, время: 19:24. |