//屏幕滚动
screenRoll = (demoAll, demoOne, demoTow) => {
let speed = 150;
let demo = document.getElementById(demoAll)
let demo1 = document.getElementById(demoOne)
let demo2 = document.getElementById(demoTow)
setTimeout(() => {
// demo2.innerHTML = demo1.innerHTML;
let myMar;
function marquee() {
try {
let demo = document.getElementById(demoAll)
let demo1 = document.getElementById(demoOne)
if (demo1.offsetHeight <= demo.offsetHeight) {
clearInterval(myMar)
let demo2 = document.getElementById(demoTow)
demo2.innerHTML = ''
}
if (demo1.offsetHeight - demo.scrollTop <= 0) {
demo.scrollTop = 0// -= demo1.offsetHeight;
} else {
demo.scrollTop++;
}
} catch (error) {
clearInterval(myMar)
}
}
myMar = setInterval(marquee, speed)
demo.onmouseenter = function () { clearInterval(myMar) }
demo.onmouseleave = function () { myMar = setInterval(marquee, speed) }
}, 300)
}
<div id='demoKL' style={{ height: 'calc(100% - 60px)', color: '#fff', width: '100%', overflow: 'hidden', position: 'relative', }}>
<div id='demo1' style={{ width: '100%', display: 'inline-block' }}>
{data}
</div>
<div id='demo2' style={{ width: '100%', display: 'inline-block' }}>
{data}
</div>
</div>```
```bash
componentDidMount() {
this.screenRoll('demoKL', 'demo1', 'demo2')
}