Faire un curseur jQuery travailler avec divs au lieu d'images

Question

Je travaille sur cette page du site poochclub.com et j'essaye de faire tout le texte au lieu des images. Le problème est quand je veux travailler sur les panneaux ci-dessous avec toutes les informations que le fichier js (appelé about.js) est configuré pour travailler avec des images à la place sur des divs où je pourrais potentiellement ajouter du texte. Je ne suis pas très bon à l'écriture javascript et je besoin d'aide pour corriger le fichier original qui se présente comme suit:

<script type="text/javascript>   
(function ($) { 
     var pages, panels, arrows, currentClass = 'current', 
      currentIndex = 0, currentSize = 0; 

    function showPage() { 
     var ctx = jQuery.trim(this.className.replace(/current/gi, '')); 
     $(this).addClass(currentClass).siblings().removeClass(currentClass); 

     $('.panel') 
      .removeClass(currentClass) 
      .find('img') 
       .removeClass(currentClass) 
       .removeAttr('style') 
      .end(); 

     panels.find('.' + ctx)   
      .addClass(currentClass) 
      .find('img')  
       .removeClass(currentClass) 
       .removeAttr('style')  
       .eq(0) 
        .fadeIn() 
        .addClass(currentClass) 
      .end()  

     currentIndex = 0; 
     currentSize = panels.find('.' + ctx + ' img').length; 
     return false; 
    } 

    function showArrows(e) { 
     arrows['fade' + (e.type === 'mouseenter' ? 'In' : 'Out')](); 
    } 

    function getPrev() { 
     currentIndex = currentIndex - 1 < 0 ? currentSize - 1 : currentIndex - 1; 
     return currentIndex; 
    } 

    function doPrev() { 
     var ctx = panels.find('div.current img'); 
     ctx.removeClass(currentClass).removeAttr('style'); 
     ctx.eq(getPrev()).fadeIn().addClass(currentClass); 
    } 

    function getNext() { 
     currentIndex = currentIndex + 1 >= currentSize ? 0 : currentIndex + 1; 
     return currentIndex;  
    } 

    function doNext() { 
     var ctx = panels.find('div.current img'); 
     ctx.removeClass(currentClass).removeAttr('style'); 
     ctx.eq(getNext()).fadeIn().addClass(currentClass); 
    } 

    $(document).ready(function() { 
     pages = $('.panels-nav a'); 
     panels = $('.panels'); 
     arrows = $('.arrows'); 

     pages.click(showPage); 
     panels.bind('mouseenter mouseleave', showArrows); 
     arrows.find('.prev').click(doPrev).end().find('.next').click(doNext); 

     pages.eq(0).click(); 
    }); 
}); 
</script> 

Ma question est, comment puis-je modifier le fichier js de trouver img à trouver plusieurs différents id div de attaché aux panles coulissantes?

Merci.

Answer 1

toute référence à img devrait être un nouveau sélecteur. Quelque chose comme 'div.slider', un div avec un curseur de classe. Regardez toutes les trouvailles, c'est où vous verrez les sélecteurs IMG.