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

BN infinity text. Countinous scroll text with pure javascript.

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;

});

3 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *