Encontrei um script de rotação de imagem jQuery e adicionando hiperlinks às imagens quebra a animação
Pergunta
Encontrei este ótimo artigo sobre o uso do jQuery para troca de imagens:
http://jquery-howto.blogspot.com/2009/05/replacing-images-at time-intervals.html
Como você sugere que eu hiperlink as imagens?
Solução 3
Resolvi-o:
function swapImages() {
var $active = $('#myGallery a:has(img) > img.active');
var $next = ($('#myGallery a:has(img.active)').next().find('img').length > 0) ? $('#myGallery a:has(img.active)').next().find('img') : $('#myGallery a:has(img):first > img');
$active.fadeOut(function() {
$active.removeClass('active');
$next.fadeIn().addClass('active');
});
}
Outras dicas
Aprenda como o jQuery funciona e conserte! Ou use um plug -in como o plug -in de ciclo - isso ainda requer algum conhecimento do jQuery.
Não testado, mas deve funcionar ...
function swapImages(tag){
var element = tag||'img';
var $active = $('#myGallery '+tag+'.active');
var $next = ($('#myGallery '+tag+'.active').next().length > 0) ? $('#myGallery '+tag+'.active').next() : $('#myGallery '+tag+':first');
$active.fadeOut(function(){
$active.removeClass('active');
$next.fadeIn().addClass('active');
});
}
setInterval(function(){swapImages('a');}, 5000);
// or the original usage with no links on the images
setInterval(swapImages, 5000);
Apenas lembre -se do que você fornece como tag
vai conseguir a aula active
Portanto, adjasia o CSS como NESSECARY.
De qualquer forma, isso é realmente simples - eu também sugeriria fazer alguns tutoriais ou ler a documentação para o jQuery. Você deve poder analisar este script enquanto o lê - é bem simples :-)
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow