Apresentações de slides em HTML W3.JS


Começar apresentação de slides:

w3.slideshow(selector, interval (milliseconds))

Exemplo

<img class="nature" src="img_snowtops.jpg">
<img class="nature" src="img_mountains.jpg">
<img class="nature" src="img_nature.jpg">

<script>
w3.slideshow(".nature");
</script>

Sem início automático

Para evitar que a apresentação de slides seja iniciada automaticamente, defina o parâmetro de intervalo para 0:

Exemplo

w3.slideshow(".nature", 0);

Próximo slide

Adicione botões para navegar pela apresentação de slides:

Quando você inicia uma apresentação de slides, a função w3.slideshow() retorna um objeto que representa a apresentação de slides.

var myShow = w3.slideshow(".nature", 0);

O objeto de apresentação de slides contém propriedades e métodos, como next() e previous():

Exemplo

<button onclick="myShow.previous()">Previous</button>
<button onclick="myShow.next()">Next</button>

Mais apresentações de slides

Qualquer elemento HTML pode ser incluído em uma apresentação de slides.

Defina qual, usando seletores CSS.

Exemplo

Cabeçalhos:

<h1 class="city">London</h1>
<h1 class="city">Paris</h1>
<h1 class="city">Tokyo</h1>

<script>
w3.slideshow(".city");
</script>