Как бесконечно перемещать div вверх и вниз в CSS3? ⇐ CSS
-
Anonymous
Как бесконечно перемещать div вверх и вниз в CSS3?
Здравствуйте, я пытаюсь выполнить простую задачу по перемещению элемента div вверх и вниз, чтобы создать эффект плавающего/зависания, используя нижнюю часть вместо верхней. Итак, от низу: 63 пикселя до низу: 400 пикселей.
Я новичок в CSS и ключевых кадрах! Как вы, наверное, догадались. Но вот что я попробовал, и это, похоже, ничего не дало:
.piece-open-space #emma { фоновое изображение: URL('images/person/Emma.png?1418918581'); ширина: 244 пикселей; высота: 299 пикселей; позиция: абсолютная; дисплей: блок; ширина: 244 пикселей; фоновое изображение: нет; позиция: абсолютная; слева: 2149 пикселей; внизу: 63 пикселя; -webkit-animation: MoveUpDown 50-е, линейная бесконечность; } @-webkit-keyframes MoveUpDown { от { внизу: 63 пикселя; } к { внизу: 400 пикселей; } } Обновить
Проблема в том, что он не зацикливается: цель, которую я ищу, достигает 400 пикселей, а затем мгновенно возвращается к 63 пикселям, как мне заставить его достичь 400 пикселей, а затем вернуться к 63 пикселям, это дает эффект бесконечный цикл «зависания/плавания».
Здравствуйте, я пытаюсь выполнить простую задачу по перемещению элемента div вверх и вниз, чтобы создать эффект плавающего/зависания, используя нижнюю часть вместо верхней. Итак, от низу: 63 пикселя до низу: 400 пикселей.
Я новичок в CSS и ключевых кадрах! Как вы, наверное, догадались. Но вот что я попробовал, и это, похоже, ничего не дало:
.piece-open-space #emma { фоновое изображение: URL('images/person/Emma.png?1418918581'); ширина: 244 пикселей; высота: 299 пикселей; позиция: абсолютная; дисплей: блок; ширина: 244 пикселей; фоновое изображение: нет; позиция: абсолютная; слева: 2149 пикселей; внизу: 63 пикселя; -webkit-animation: MoveUpDown 50-е, линейная бесконечность; } @-webkit-keyframes MoveUpDown { от { внизу: 63 пикселя; } к { внизу: 400 пикселей; } } Обновить
Проблема в том, что он не зацикливается: цель, которую я ищу, достигает 400 пикселей, а затем мгновенно возвращается к 63 пикселям, как мне заставить его достичь 400 пикселей, а затем вернуться к 63 пикселям, это дает эффект бесконечный цикл «зависания/плавания».
Мобильная версия