Information
<div class="ecl-news-ticker" data-ecl-news-ticker="true" data-ecl-auto-init="NewsTicker">
<div class="ecl-news-ticker__container">
<div class="ecl-news-ticker__content">
<ul class="ecl-news-ticker__slides" id="news-ticker-example-content">
<li class="ecl-news-ticker__slide" aria-hidden="true"><a href="/example"
class="ecl-link ecl-news-ticker__slide-text" tabindex="-1">Lorem ipsum dolor sit amet, consectetur
adipiscing elit</a></li>
<li class="ecl-news-ticker__slide" aria-hidden="true"><a href="/example"
class="ecl-link ecl-news-ticker__slide-text" tabindex="-1">Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat</a></li>
<li class="ecl-news-ticker__slide" aria-hidden="true"><a href="/example"
class="ecl-link ecl-news-ticker__slide-text" tabindex="-1">Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur</a></li>
<li class="ecl-news-ticker__slide" aria-hidden="true"><a href="/example"
class="ecl-link ecl-news-ticker__slide-text" tabindex="-1">Excepteur sint occaecat cupidatat officia
deserunt mollit anim id est laborum</a></li>
<li class="ecl-news-ticker__slide" aria-hidden="true"><a href="/example"
class="ecl-link ecl-news-ticker__slide-text" tabindex="-1">Sed ut perspiciatis unde omnis iste natus error
sit voluptatem accusantium</a></li>
<li class="ecl-news-ticker__slide">Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit
sed quia consequuntur magni dolores</li>
</ul>
</div>
</div><svg class="ecl-icon ecl-icon--m ecl-news-ticker__icon" focusable="false" aria-hidden="true">
<use xlink:href="/dist/media/icons.cec58484.svg#information"></use>
</svg>
<div class="ecl-news-ticker__counter"><span class="ecl-news-ticker__counter--current">1</span> of <span
class="ecl-news-ticker__counter--max">6</span></div>
<div class="ecl-news-ticker__controls"><button class="ecl-button ecl-button--primary ecl-news-ticker__prev"
type="button" data-ecl-news-ticker-prev="" aria-controls="news-ticker-example-content"><span
class="ecl-button__container"><span class="ecl-u-sr-only" data-ecl-label="true">Previous news</span><svg
class="ecl-icon ecl-icon--m ecl-icon--rotate-270 ecl-button__icon ecl-button__icon--after" focusable="false"
aria-hidden="true" data-ecl-icon="">
<use xlink:href="/dist/media/icons.cec58484.svg#corner-arrow"></use>
</svg></span></button><button class="ecl-button ecl-button--primary ecl-news-ticker__toggle" type="button"
data-ecl-news-ticker-toggle="" data-action="stop"><span class="ecl-button__container"><span class="ecl-u-sr-only"
data-ecl-label="true">News ticker auto play</span><svg
class="ecl-icon ecl-icon--m ecl-button__icon ecl-button__icon--after" focusable="false" aria-hidden="true"
data-ecl-icon="">
<use xlink:href="/dist/media/icons.cec58484.svg#play"></use>
</svg></span></button><button class="ecl-button ecl-button--primary ecl-news-ticker__next" type="button"
data-ecl-news-ticker-next="" aria-controls="news-ticker-example-content"><span class="ecl-button__container"><span
class="ecl-u-sr-only" data-ecl-label="true">Next news</span><svg
class="ecl-icon ecl-icon--m ecl-icon--rotate-90 ecl-button__icon ecl-button__icon--after" focusable="false"
aria-hidden="true" data-ecl-icon="">
<use xlink:href="/dist/media/icons.cec58484.svg#corner-arrow"></use>
</svg></span></button></div>
</div>Try it yourself on the playground
Playground