Barmer Fractal

Slider Bullets: Disc 

<div class="m-slider-bullets glide__bullets slider-bullets--disc" aria-hidden="true">
    <ul class="slider-bullets__list" data-glide-el="controls[nav]">
        <li class="slider-bullet glide__bullet" data-glide-dir="=0">
            <button class="slider-bullet__button"><span class="sr-only">Zum Element 1</span><i class="a-icon icon--dot" aria-hidden="true"></i></button>
        </li>
        <li class="slider-bullet glide__bullet" data-glide-dir="=1">
            <button class="slider-bullet__button"><span class="sr-only">Zum Element 2</span><i class="a-icon icon--dot" aria-hidden="true"></i></button>
        </li>
        <li class="slider-bullet glide__bullet glide__bullet--active" data-glide-dir="=2">
            <button class="slider-bullet__button"><span class="sr-only">Zum Element 3</span><i class="a-icon icon--dot" aria-hidden="true"></i></button>
        </li>
    </ul>
</div>
 
<div class="m-slider-bullets glide__bullets slider-bullets--disc" {{^switches.isA11yVisible}}aria-hidden="true"{{/switches.isA11yVisible}}>
  <ul class="slider-bullets__list" data-glide-el="controls[nav]">
    {{#each partials.slide }}
      {{#ifcond @index '<' ../switches.slideCount}}
        {{#ifcond @index '==' ../switches.activeSlide}}
          <li class="slider-bullet glide__bullet glide__bullet--active" data-glide-dir="={{@index}}">
            <button class="slider-bullet__button"><span class="sr-only">Zum Element {{math @index '+' 1}}</span>{{render '@icon--dot'}}</button>
          </li>
        {{else}}
          <li class="slider-bullet glide__bullet" data-glide-dir="={{@index}}">
            <button class="slider-bullet__button"><span class="sr-only">Zum Element {{math @index '+' 1}}</span>{{render '@icon--dot'}}</button>
          </li>
        {{/ifcond}}
      {{/ifcond}}
    {{/each}}
  </ul>
</div>
 
{
  "switches": {
    "slideCount": 3,
    "activeSlide": 2,
    "isA11yVisible": false
  },
  "viewtypes": {},
  "content": {},
  "partials": {
    "slide": [
      {
        "switches": {},
        "viewtypes": {},
        "content": {},
        "partials": {}
      },
      {
        "switches": {},
        "viewtypes": {},
        "content": {},
        "partials": {}
      },
      {
        "switches": {},
        "viewtypes": {},
        "content": {},
        "partials": {}
      },
      {
        "switches": {},
        "viewtypes": {},
        "content": {},
        "partials": {}
      },
      {
        "switches": {},
        "viewtypes": {},
        "content": {},
        "partials": {}
      },
      {
        "switches": {},
        "viewtypes": {},
        "content": {},
        "partials": {}
      }
    ]
  }
}

No notes defined.