Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom dia,
Tenho um plugin Wordpress com essa estrutura em HTML, a imagem dentro de .image-block fica ao lado esquerdo em um tamanho grande e as imagens dentro de .right-block são outras imagens em miniatura que ao serem clicadas vai para .image-block do lado esquerdo, até ai tudo bem, mas agora essas imagens tem que ser alteradas sozinhas, pensei em um clique automático. Essa seria a melhor forma? caso for pode me auxiliar por favor?
<div class="popup-wrapper popup-wrapper_3" style="overflow-y: auto;">
<div class="image-block_3 image-block ">
<img alt="TITULO" id="wd-cl-img1" src="http://www.iranprogrammers.ir/file/pic/user/14.jpg">
</div>
<div class="right-block">
<h3 class="title">TITULO</h3>
<div>
<ul class="thumbs-list thumbs-list_3">
<li class="active">
<a href="" class="img-thumb" title="">
<img src="http://s1-media.maxyart.com/media/users/rangga_effendi/66b846840965605b35c1ee4bdf824cbd.png">
</a>
</li>
<li>
<a href="" class="img-thumb" title="">
<img src="http://s1-media.maxyart.com/media/users/rangga_effendi/66b846840965605b35c1ee4bdf824cbd.png">
</a>
</li>
<li>
<a href="" class="img-thumb" title="">
<img src="http://s1-media.maxyart.com/media/users/rangga_effendi/66b846840965605b35c1ee4bdf824cbd.png">
</a>
</li>
</ul>
</div>
</div>
</div>Não conheço muito bem jquery, no máximo faço algumas navegações pelo DOM ao clicar... Mas disparar automaticamente como seria? :huh:
setInterval(slide,3000);
function slide() {
$(".right-block div .thumbs-list li a img").next();
}Eu recomendaria usar setTimeout ao invés de setInterval porque ambos são assíncronos. Melhor criar um intervalo usando setTimeout para executar um de cada vez (e reservar o identificador do mesmo timeout vai ser útil quando você quiser cancelar o mesmo com clearTimeout):
var lastSlideTimeout, $img
$img = $(".right-block div .thumbs-list li a img")
lastSlideTimeout = setTimeout(slide, 300)
function slide() {
$img.next()
lastSlideTimeout = setTimeout(slide, 300)
}Não entendi, você já deu sua resposta... Setinterval
>
Eu recomendaria usar setTimeout ao invés de setInterval porque ambos são assíncronos. Melhor criar um intervalo usando setTimeout para executar um de cada vez (e reservar o identificador do mesmo timeout vai ser útil quando você quiser cancelar o mesmo com clearTimeout):
var lastSlideTimeout, $img;
$img = $(".right-block div .thumbs-list li a img");
lastSlideTimeout = setTimeout(slide, 300);
function slide() {
$img.next();
lastSlideTimeout = setTimeout(slide, 300);
}Olá pessoal, primeiramente obrigado por responder. Então Sexy Yune dessa forma $img.next(); vai navegar para a próxima imagem de acordo com esse HTML sempre que a função repetir de acordo com time? Eu não consigo imaginar como ela vai reconhecer o primeiro .right-block div .thumbs-list li a img sem a ação click()
Olha, não conheço bem todos os métodos do jQuery, mas de acordo com isso, não, não vai navegar para próxima imagem. next serve para capturar um/uns próximo(s) elemento(s), por ex.:
<span id="primeiro">primeiro</span>
<b>text</b>
$("#primeiro").next() // [ <b>text</b> ]setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Eu sei, Electronic, mas é mais seguro que setInterval nesse contexto, porque é assíncrono ;), é melhor esperar a execução de cada rodada desse intervalo, diferente do que o setInterval faria.
E seria melhor ainda usar requestAnimationFrame dependendo do que a pessoa quer fazer.
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
>
setTimeout só executa uma vez
ele quer que se repita num intervalo de tempo entao é mesmo setInterval.
Simular o clique:
da uma olhada em trigger()
e o metodo next() aceita argumento que no caso seria onde estao as imagens
Preste mais atenção no que eu disse:
http://bonsaiden.github.io/JavaScript-Garden/#other.timeouts
Não entendi, você já deu sua resposta... Setinterval