Estoy creando algo asi como un banner para customizar un fondo de pantalla con un fichero html
Encontré un script en javascript que te lee los feeds RSS y te los colocar en un fichero html.
Luego con el CSS he podido dejarlo a mi gusto y queda bien.
Me encuentro, que principalmente no se como limitar la cantidad de entradas lee el script de la url (RSS).
Os paso un poco el codigo que tengo:
javascript
let url = 'https://catalunyadiari.com/rss/cat/actualitat';
const textarea = document.querySelector('#feed-textarea > ul');
feednami.load(url)
.then(feed => {
textarea.value = ''
for(let entry of feed.entries){
//create a list element
let li = document.createElement('li');
//add HTML content to list items
li.innerHTML = `${entry.title}`;
//append HTML content to list
textarea.appendChild(li);
}
});
html
<section class="news-wrapped">
<h3 id="date"></h3>
<div class="news">
<div id="feed-textarea">
<ul></ul>
</div>
</div>
</section>
CSS
.news div:nth-child(-n+10){
animation: slide 12s infinite;
}
@keyframes slide{
0%{ margin-top: -240px;}
5%{ margin-top: -160px;}
35%{margin-top: -160px;}
40%{margin-top: -80px;}
}
este script me genera como 20 lineas "li", por lo que al hacer las transiciones entre 'li' esto me fastidia todas las animaciones.
Entonces tengo dos opciones:
- Limito la cantidad de elementos que genera el script.
- Efecto en css que sea uniforme para que las animaciones vayan bien.
Como podría solucionar esto, veo que casi lo tengo pero no acabo de rematarlo.
MUCHAS GRACIAS DE ANTEMANO!!