Rijen schuiven gestaffeld in

<!-- Rijen schuiven gestaffeld in · NedDev · eigen werk. -->
<div class="jouw-container">
<div class="ei-rfu"><div class="ei-rfu__sc"><span class="ei-rfu__k">Tarieven 2026 · Schilderwerk Jansen</span><ul class="ei-rfu__l"><li><span>Binnenschilderwerk per m²</span><b>€ 18</b></li><li><span>Kozijnen buiten, per stuk</span><b>€ 145</b></li><li><span>Houtrot herstel</span><b>€ 65 /u</b></li><li><span>Plafond spuiten per m²</span><b>€ 12</b></li><li><span>Voordeur lakken</span><b>€ 210</b></li><li><span>Behang verwijderen per m²</span><b>€ 6</b></li><li><span>Trapleuning en spijlen</span><b>€ 380</b></li><li><span>Gratis inspectie aan huis</span><b>€ 0</b></li></ul><span class="ei-rfu__end">Prijzen incl. btw, materiaal apart.</span></div></div>
</div>

/* Rijen schuiven gestaffeld in · NedDev · eigen werk. */
.ei-rfu{position:absolute;inset:0}
.ei-rfu__sc{position:absolute;inset:0;overflow:auto;padding:18px 22px 30px;box-sizing:border-box;scrollbar-width:thin}
.ei-rfu__k{display:block;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#F5480F;margin-bottom:8px}
.ei-rfu__l{list-style:none;margin:0;padding:0}
.ei-rfu__l li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 0;border-bottom:1px solid rgba(10,10,10,.12);font-family:'Switzer',sans-serif;font-size:15px;color:#0a0a0a;opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
.ei-rfu__l li.is-in{opacity:1;transform:none}
.ei-rfu__l b{font-weight:700;white-space:nowrap}
.ei-rfu__end{display:block;margin-top:12px;font-family:'Switzer',sans-serif;font-size:12px;color:rgba(10,10,10,.55)}
@media(prefers-reduced-motion:reduce){.ei-rfu__l li{opacity:1;transform:none;transition:none}}

// Rijen schuiven gestaffeld in · NedDev · eigen werk.
// root = het element waarin de HTML staat
function init(root){
var sc=root.querySelector('.ei-rfu__sc'),lis=[].slice.call(sc.querySelectorAll('li'));var q=[],timer=0;
function flush(){if(!q.length){timer=0;return;}q.shift().classList.add('is-in');timer=setTimeout(flush,90);}
var io=new IntersectionObserver(function(es){es.filter(function(e){return e.isIntersecting;}).sort(function(a,b){return a.boundingClientRect.top-b.boundingClientRect.top;}).forEach(function(e){io.unobserve(e.target);q.push(e.target);});if(!timer)flush();},{root:sc,threshold:.3});
var outer=new IntersectionObserver(function(es){if(es[0].isIntersecting){lis.forEach(function(li){io.observe(li);});outer.disconnect();}},{threshold:.3});outer.observe(sc);
}
init(document.querySelector('.jouw-container'));