Java-Scripts.net

Scrolling Billboard Text

Display breaking news or updates. This script creates a smooth, continuous scrolling text effect using CSS animations, replacing the old deprecated HTML marquee tag.

? BREAKING NEWS: JavaScript is awesome ? Welcome to Java-Scripts.net ? Download free scripts today! ?

Copy the Script

<style>
.marquee-container {
    overflow: hidden;
    white-space: nowrap;
    background: #000; color: #fff;
}

.marquee-content {
    display: inline-block;
    padding-left: 100%;
    animation: scroll-left 15s linear infinite;
}

/* Pause on hover */
.marquee-content:hover { animation-play-state: paused; }

@keyframes scroll-left {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}
</style>

<div class="marquee-container">
    <div class="marquee-content">
        Your scrolling text goes here...
    </div>
</div>

Frequently Asked Questions

The `` tag is deprecated and obsolete. It may not work in future browsers. CSS animations or JavaScript are the modern standards.

Yes. To scroll right-to-left (default) use `translateX(-100%)`. To scroll left-to-right, use `translateX(100%)` and adjust starting positions.

Yes. You can add `animation-play-state: paused;` to the CSS `:hover` selector for the scrolling element.