Показать сообщение отдельно
  #6 (permalink)  
Старый 23.10.2019, 15:48
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,714

Сообщение от misha.korolcov
пробовал перенести у себя на строку не не получается
Вы что-то не то делаете! Если только текст, то так...
<text-display text="Hello world!"></text-display>

<style>

text-display {
	background: linear-gradient(to bottom, #333, black);
	background-color: #111;
	color: white;
	font: 900 1em / 1.5 monospace, system-ui;
	display: flex;
	overflow: hidden;
	white-space: nowrap;
}

text-display::before, text-display::after {
	content: attr(text) "\a0";
	min-width: 100%;
	will-change: transform;
	animation: text-display 15s linear infinite;
	animation-direction: inherit;
	flex: 1 0 auto;
	text-align: center;
}

:lang(ar), :lang(he) {
	animation-direction: reverse;
}

@keyframes text-display {
	to {
		transform: translateX(-100%);
	}
}

</style>


Если нужно отображать HTML-содержимое в бегущей строке, то смотрите моё сообщение выше!
Ответить с цитированием