Infinity marquee text
Infinity marquee text. Continuous scroll with no break. Simple code with javascript. Easy to use
HTML5 | CSS3 | JavaScript
Version: 1.0.0
Code
<div class="bnInfinityScroll">
<marquee id="bnMarqueeText" scrollamount="8" direction="left" behavior="scroll" >BN infinity text. Countinous scroll text with pure javascript. </marquee>
</div>
.bnInfinityScroll {
max-width: 1000px;
margin: auto;
padding: 20px 20px;
}
#bnMarqueeText {
display: block;
overflow: hidden;
position: relative;
background: transparent;
color: #000;
padding: 5px 10px;
border: 1px solid #000000;
border-radius: 0;
font-size: 22px;
line-height: 1;
}
document.addEventListener("DOMContentLoaded", function(event) {
const bnMarquee = document.getElementById('bnMarqueeText');
let bnScrollText = bnMarquee.innerHTML;
let bnMultiplyText = bnScrollText.repeat(100);
bnMarquee.innerHTML = bnMultiplyText;
});