1. java
  2. android
  3. c#
  4. .net
  5. javascript
  6. php
  7. jquery
  8. html
  9. sql

Rotatividade de imagens

Bom, não estou conseguindo fazer rotatividade de imagens em HTML/CSS/JavaScript. Eu fiz o seguinte código : HTML : Promoção: Big City Night

// Isso aqui é só pra lembrar que não esqueci de referenciar o JS

JavaScript : var banners =["img/destaque-home.png","img/destaque-home-2.png"]; var bannerAtual = 1;

function trocaBanner() { bannerAtual = (bannerAtual + 1) % 2; document.querySelector('.destaque img').src = banners[bannersAtual]; } var timer = setInterval(trocaBanner, 4000); var controle = document.querySelector('.pause');

controle.onclick = function() { if (controle.className == 'pause') { clearInterval(timer); controle.className = 'play'; } else { timer = setInterval(trocaBanner, 4000); controle.className = 'pause'; } return false; }

CSS : .destaque { position: relative; } .pause, .play { display: block; position: absolute; right: 15px; top: 15px; } .pause { border-left: 10px solid #900; border-right: 10px solid #900; height: 30px; width: 5px; } .play { margin-bottom : 15px; border-left: 25px solid #900; border-bottom: 15px solid transparent; border-top: 15px solid transparent; }

  1. Você vai ver essas setas em qualquer página de pergunta. Com elas, você pode dizer se uma pergunta ou uma resposta foram relevantes ou não.
  2. Edite sua pergunta ou resposta caso queira alterar ou adicionar detalhes.
  3. Caso haja alguma dúvida sobre a pergunta, adicione um comentário. O espaço de respostas deve ser utilizado apenas para responder a pergunta.
  4. Se o autor da pergunta marcar uma resposta como solucionada, esta marca aparecerá.
  5. Clique aqui para mais detalhes sobre o funcionamento do GUJ!

0 resposta

Não é a resposta que estava procurando? Procure outras perguntas com as tags javascript html5 html css3 css ou faça a sua própria pergunta.