Как это не работает?
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style>
.currency_quotation {
width: 100%;
overflow: hidden;
position: relative;
}
#marquee {
display: inline-block;
background-color: #FFD700;
white-space: nowrap;
transform: translateX(100%);
}
#marquee p {
display: inline;
margin-right: 50px;
}
.marquee_pause_active { background-color:red;}
</style>
<script>
window.addEventListener("load", function() {
var wrapper = document.querySelector(".currency_quotation"),
marquee = document.querySelector("#marquee"),
wrapperWidth = wrapper.offsetWidth,
marqueeWidth = marquee.scrollWidth,
currentTX = wrapperWidth;
wrapper.addEventListener("mouseenter", function() {
wrapper.classList.remove("move");
});
wrapper.addEventListener("mouseleave", function() {
wrapper.classList.add("move");
});
window.addEventListener("resize", function() {
wrapperWidth = wrapper.offsetWidth;
marqueeWidth = marquee.scrollWidth;
currentTX = wrapperWidth;
})
document.querySelector('.marquee_pause').onclick = function() {
wrapper.classList.toggle("move");
this.classList.toggle('marquee_pause_active');
}
function move() {
if (wrapper.classList.contains("move")) {
currentTX--;
}
if (-currentTX >= marqueeWidth) {
currentTX = wrapperWidth;
}
marquee.style.transform = "translateX(" + currentTX + "px)";
}
var interval = setInterval(move, 20);
});
</script>
</head>
<body>
<div class="currency_quotation move">
<div id=marquee>
<p>Старт прошел в ночь на 8 января 2018 года с пускового комплекса SLC-40 на мысе Канаверал во Флориде..</p>
<p>Стратегическое командование США сообщило, что не зафиксировала новый военный спутник на заданной орбите. Некоторые СМИ уже предположили, что американский спутник-шпион упал в океан. В компании Илона Маска утверждали, что, по их данным, Falcon 9 отработал в штатном режиме. Позже в SpaceX начали расследование. Уже заявлено, что «к настоящему моменту нет признаков саботажа или другого вмешательства» в процесс запуска спутника.</p>
</div>
</div>
<button class="marquee_pause">Pause</button>
</body>
</html>