Joomla! 5.x • Ticker does not continue...and is too small...

Hello,

I have made a ticker at https://ontwikkel16.comp-it-aut.nl/ in SP Page builder.
The pictures don't continue and the pictures should be higher like the ticker at: https://frankiacamperclubnederland.nl/.

Can someone help me with the correct code?

In the PAGE CSS:

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lichtkrant</title>
<style>
body {
margin: 0;
overflow: hidden;
color: yellow;
font-size: 30px;
white-space: nowrap;
background-color: black; /* Aanzicht verbeteren met een donkere achtergrond */
}
#lichtkrant
{
display: inline-flex;
overflow: hidden;
animation: scroll 20s linear infinite;

/* Standaard animatiestatus */
}

#lichtkrant:hover
{
animation-play-state: paused; /* Pauzeer animatie bij hover */
}
@keyframes scroll {
0% {
transform: translateX(0); /* Startpositie */
}
100% {
transform: translateX(-100%); /* Eindpositie */
}
}
.lichtkrant_img {
width: auto;
height: 200px;
animation-play-state: running;
object-fit: contain; /* zorgt ervoor dat de gehele afbeelding zichtbaar is terwijl de verhouding behouden blijft */
margin-right: 20px; /* Ruimte tussen de afbeeldingen */
}
</style>

At the page:

<p>
<title>Lichtkrant</title>
</p>
<div id="lichtkrant">
<p>&nbsp;</p>
<a href="https://www.campercoating.eu/" target="_blank" rel="noopener"><img class="lichtkrant_img" src="/images/lichtkrant/campercoating-groen-vlak.png" alt="campercoating groen vlak" /></a> <a href="https://www.e-boekhouden.nl/" target="_blank" rel="noopener"><img class="lichtkrant_img" src="/images/lichtkrant/eboekhouden-banner.jpg" alt="Eboekouden banner" /></a> <a href="https://frankiacamperclubnederland.nl/" target="_blank" rel="noopener"><img class="lichtkrant_img" src="/images/lichtkrant/Frankia_camper_club.png" alt="Frankia camper club" /></a> <a href="https://www.comp-it-aut.nl/" target="_blank" rel="noopener"><img class="lichtkrant_img" src="/images/lichtkrant/logo-compitaut.png" alt="Logo Compitaut" /></a> <a href="https://www.dropbox.com/scl/fi/bsllm0he ... 1&amp;dl=0" target="_blank" rel="noopener"><img class="lichtkrant_img" src="/images/lichtkrant/Logo-Seminautic.png" alt="Logo Seminautic" /></a> <a href="https://www.raemacaravans.nl/" target="_blank" rel="noopener"><img class="lichtkrant_img" src="/images/lichtkrant/Raema-logo.jpg" alt="Raema logo" /></a> </div>

Statistics: Posted by liekecomp2022 — Tue Dec 03, 2024 11:39 am

---