2010-03-17 5 views
1

J'ai créé un script jQuery (avec aide) qui fonctionne très bien mais j'en ai besoin pour automatiser/animer sans utiliser la fonction click, je veux juste savoir si c'est possible et si oui, comment? Similaire à un diaporama.jQuery - Comment animer la fonction de clic sans cliquer (Slide-show like) - Est-ce possible?

Fondamentalement, le code me permet de cliquer sur une image et masquer/afficher un DIV, tout en changeant une liste d'éléments tels que le nom de classe/id.

Voici mon code:

JQUERY:

jQuery(document).ready(function(){ 
    //if this is not the first tab, hide it 
    jQuery(".imgs:not(:first)").hide(); 
    //to fix u know who 
    jQuery(".imgs:first").show(); 
    //when we click one of the tabs 
    jQuery(".img_selection a").click(function(){ 
     //get the ID of the element we need to show 
     stringref = jQuery(this).attr("href").split('#')[1]; 

     // adjust css on tabs to show active tab 
     $('.img_selection a').removeAttr('id'); // remove all ids 
     $(this).attr('id', this.className + "_on") // create class+_on as this id. 
     //hide the tabs that doesn't match the ID 
     jQuery('.imgs:not(#'+stringref+')').hide(); 
     //fix 
     if (jQuery.browser.msie && jQuery.browser.version.substr(0,3) == "6.0") { 
      jQuery('.imgs#' + stringref).show(); 
     } else 
      //display our tab fading it in 
      jQuery('.imgs#' + stringref).show(); 
     //stay with me 
     return false; 
    }); 
}); 
+0

I tout à fait n'obtenez pas quel est votre problème ici ... Si vous voulez l'appeler automatiquement, appelez-le simplement sur document prêt ou en utilisant setTimeout? – marcgg

+0

Je suis nouveau à tout cela, donc je ne suis pas vraiment sûr de savoir comment faire, plus de perspicacité? J'adorerais l'aide! – iamtheratio

Répondre

2

Cela devrait le faire. Il obtient tous les "onglets" et clique im pour circulaire avec une pause de 2 secondes (2000ms) entre chaque clic

var tabs = jQuery(".img_selection a"); 
var len = tabs.size(); 
var index = 1; 
function automate() { 
    tabs.eq((index%len)).trigger('click'); 
    index++; 
} 
var robot = setInterval(automate, 2000); 

//if at some point you want to stop the automation just call 
clearInterval(robot); 

Fait une démonstration

http://jsbin.com/urulo/2/ (http://jsbin.com/urulo/2/edit pour le code)

+0

@jitter: J'ai ajouté ceci à mon code mais cela ne fonctionne pas, je pourrais le placer au mauvais endroit. Des idées? Désolé, je suis définitivement un débutant avec jquery/js. – iamtheratio

+0

Vérifiez le lien dans la réponse étendue. Faites une démo pour vous et optimisez votre code un peu trop – jitter

+0

Cela fonctionne très bien, mais je ne vois qu'un seul problème. Comme il se charge sur tab1, l'animation commence sur tab1, donc elle charge celle-là deux fois. Y a-t-il un moyen de lancer l'animation sur l'onglet 2? donc sur la page de chargement, il charge 1, puis il anime à l'onglet 2? – iamtheratio