styleguide 0.30.11

43 - Horizontal scroller

Requires javascript

See documentation for db.libs.scroller.

43.1 - Normal

Scroller for horizontal content in a list view. Scrollsnap on mobile.

<div class="horizontal-scroller">
   <a class="nav-item start hide" href="#">
       <span class="icon-Arrow-alt-left start"></span>
   </a>
   <div class="inner">
       <ul class="list">
           <li>
               <a href="https://www.dagbladet.no/studio/nyhetsstudio/5?post=2670">
                   <header class="align">
                       <h1 class="title">Grisebønder får penger for å slutte</h1>
                   </header>
                   <span class="text">Omsetningsrådet har vedtatt at grisebønder skal få tilskudd for å legge ned driften. Årsaken erat det er altfor mye svinekjøtt på lager.</span>
               </a>
           </li>
           <li>
               <a href="https://www.dagbladet.no/studio/nyhetsstudio/5?post=2669">
                   <header class="align">
                       <h1 class="title">- Sikringsarbeidet avsluttes</h1>
                   </header>
                   <span class="text">Sikringsarbeidet avsluttes onsdag morgen på grunn av væromslaget, opplyser Forsvaret. Det er meldt kraftig vind med vindkast på opptil 35 meter i sekundet.
                   </span>
               </a>
           </li>
           <li>
               <a href="https://www.dagbladet.no/studio/nyhetsstudio/5?post=2668">
                   <header class="align">
                       <h1 class="title">Nordmann del av stort narkotikanettverk i Australia</h1>
                   </header>
                   <span class="text">En 29 år gammel norsk statsborger bosatt i Australia knyttes til et stort narkotikanettverk i Australia, ifølge VG. Nordmannen er ifølge avisa en av 28 personer som er tiltalt for over 100 narkotikarelaterte lovbrudd. Nettverket har operert på den australske vestkysten.</span>
               </a>
           </li>
           <li>
               <a href="https://www.dagbladet.no/studio/nyhetsstudio/5?post=2667">
                   <header class="align">
                       <h1 class="title">Pågrepne ukrainske sjømenn vist på russisk TV</h1>
                   </header>
                   <span class="text">Den russiske sikkerhetstjenesten FSB har offentliggjort videoer av tre ukrainske sjømenn som søndag ble pågrepet av russisk kystvakt utenfor Krim-halvøya.(NTB)</span>
               </a>
           </li>
           <li>
               <a href="https://www.dagbladet.no/studio/nyhetsstudio/5?post=2666">
                   <header class="align">
                       <h1 class="title">Norwegian foreløpig uten flykjøper</h1>
                   </header>
                   <span class="text">Én måned etter at Norwegian-sjef Bjørn Kjos meldte at selskapet lette etter flymedeier, er det fortsatt ikke inngått noen avtale.</span>
               </a>
           </li>
           <li>
               <a href="https://www.dagbladet.no/studio/nyhetsstudio/5?post=2665">
                   <header class="align">
                       <h1 class="title">Ingen pågrepet etter voldsepisode i Trondheim</h1>
                   </header>
                   <span class="text">En kvinne og en mann ble utsatt for vold i sitt eget hjem på Saupstad i Trondheim tirsdag kveld. Så langt er ingen pågrepet i saken.</span>
               </a>
           </li>
           <li>
               <a href="https://www.dagbladet.no/studio/nyhetsstudio/5?post=2664">
                   <header class="align">
                       <h1 class="title">CNN: Cindy Hyde-Smith vinner omvalget i Mississippi</h1>
                   </header>
                   <span class="text">Republikanerne Cindy Hyde-Smith vinner omvalget i Mississippi over demokraten Mike Espy, og sikrer dermed republikanerne sitt 53. sete i Senatet, mot demokratenes 47.</span>
               </a>
           </li>
       </ul>
   </div>
   <a class="nav-item next" href="#">
       <span class="icon-Arrow-alt-right next"></span>
   </a>
</div>