Ybooh: mudanças entre as edições

De otPokemon Wiki
Ir para navegação Ir para pesquisar
Sem resumo de edição
(Limpou toda a página)
Etiquetas: anulando Reversão manual
 
(154 revisões intermediárias por 3 usuários não estão sendo mostradas)
Linha 1: Linha 1:
<h1>CSS-only Carousel</h1>


<div class="carousel" aria-label="Gallery">
  <ol class="carousel__viewport">
    <li id="carousel__slide1"
        tabindex="0"
        class="carousel__slide">
      <div class="carousel__snapper">
        <a href="#carousel__slide4"
          class="carousel__prev">Go to last slide</a>
        <a href="#carousel__slide2"
          class="carousel__next">Go to next slide</a>
      </div>
    </li>
    <li id="carousel__slide2"
        tabindex="0"
        class="carousel__slide">
      <div class="carousel__snapper"></div>
      <a href="#carousel__slide1"
        class="carousel__prev">Go to previous slide</a>
      <a href="#carousel__slide3"
        class="carousel__next">Go to next slide</a>
    </li>
    <li id="carousel__slide3"
        tabindex="0"
        class="carousel__slide">
      <div class="carousel__snapper"></div>
      <a href="#carousel__slide2"
        class="carousel__prev">Go to previous slide</a>
      <a href="#carousel__slide4"
        class="carousel__next">Go to next slide</a>
    </li>
    <li id="carousel__slide4"
        tabindex="0"
        class="carousel__slide">
      <div class="carousel__snapper"></div>
      <a href="#carousel__slide3"
        class="carousel__prev">Go to previous slide</a>
      <a href="#carousel__slide1"
        class="carousel__next">Go to first slide</a>
    </li>
  </ol>
  <div class="carousel__navigation">
    <ol class="carousel__navigation-list">
      <li class="carousel__navigation-item">
        <a href="#carousel__slide1"
          class="carousel__navigation-button">Go to slide 1</a>
      </li>
      <li class="carousel__navigation-item">
        <a href="#carousel__slide2"
          class="carousel__navigation-button">Go to slide 2</a>
      </li>
      <li class="carousel__navigation-item">
        <p href="#carousel__slide3"
          class="carousel__navigation-button">Go to slide 3</a>
      </li>
      <li class="carousel__navigation-item">
        <a href="#carousel__slide4"
          class="carousel__navigation-button">Go to slide 4</a>
      </li>
    </ol>
  </div>
</div>
<div class="slidershow middle">
    <div class="slides">
      <input type="radio" name="r" id="r1" checked>
      <input type="radio" name="r" id="r2">
      <input type="radio" name="r" id="r3">
      <input type="radio" name="r" id="r4">
      <input type="radio" name="r" id="r5">
      <div class="slide s1">
        <img src="https://images.unsplash.com/photo-1547782793-e1444139967a?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=750&q=80" alt="">
      </div>
      <div class="slide">
        <img src="https://images.unsplash.com/photo-1556115908-233c785befbe?ixlib=rb-1.2.1&auto=format&fit=crop&w=750&q=80" alt="">
      </div>
      <div class="slide">
        <img src="https://images.unsplash.com/photo-1548438929-0b0e7342d732?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=750&q=80" alt="">
      </div>
      <div class="slide">
        <img src="https://images.unsplash.com/photo-1548431001-424da3e6328f?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=750&q=80" alt="">
      </div>
      <div class="slide">
        <img src="https://images.unsplash.com/photo-1559597748-34913c8ba036?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=750&q=80" alt="">
      </div>
      <div id="controls">
<label for="r1" class="bar-arrow"></label>
        <label for="r2" class="bar-arrow"></label>
        <label for="r3" class="bar-arrow"></label>
        <label for="r4" class="bar-arrow"></label>
        <label for="r5" class="bar-arrow"></label>
</div>
      <div class="navigation">
        <label for="r1" class="bar"></label>
        <label for="r2" class="bar"></label>
        <label for="r3" class="bar"></label>
        <label for="r4" class="bar"></label>
        <label for="r5" class="bar"></label>
      </div>   
    </div>
   
  </div>

Edição atual tal como às 17h43min de 29 de julho de 2024

Disponível em “https://wiki.otpokemon.com/index.php?title=Ybooh&oldid=25449”