jQuery Accordion - Faites défiler jusqu'à l'élément avec la classe spécifique sur la section ouverte

Question

J'ai combiné une fonction de recherche avec un accordéon jQueryUI.
La fonction de recherche met en évidence le titre de chaque section que le terme de recherche entré est trouvé. J'essaie de trouver un moyen de faire défiler la fenêtre vers la première occurrence d'un terme trouvé lorsqu'une section est ouverte, ce qui évite à l'utilisateur de devoir faire défiler du contenu potentiellement très long.
Chaque terme mis en surbrillance est entouré de <span class="highlight"&gt;term&lt;/span>. J'en suis au point où j'ai ajouté un gestionnaire onclick="jumpTo(chapter_number)" à chaque en-tête de section lorsqu'un terme y est trouvé. J'ai juste besoin d'aide avec la fonction jumpTo. Je vous remercie!

Voici mon violon: http://jsfiddle.net/jameshuckabonetech/YsdDn/

post-scriptum Le violon est génial! Premier ...

MISE À JOUR code Fin ...

$("#accordion").accordion(
{ 
    autoHeight: false, collapsible: true, active: false, 
    activate:function(event, ui) 
    { 
     if ($(ui.newPanel).find('.highlight').length>0 && $("#jump-box").prop('checked') == true) 
      $('html, body').animate(
      { 
       scrollTop: $(ui.newPanel).find('.highlight').offset().top 
      } 
      , 2000); 
    } 
}); 

Answer 1

Ne pas utiliser onclick utiliser l'événement activate de l'accordéon.

$("#accordion").accordion({ 
    autoHeight: false, collapsible: true, active: false, 
    activate:function(event, ui){ 
     if ($(ui.newPanel).find('.highlight').length>0) 
      $('html, body').animate({ 
       scrollTop: $(ui.newPanel).find('.highlight').offset().top 
       }, 2000); 
    }, 
    beforeActivate:function(e,ui) 
    { 
     //if statement to check if you want to stop the accordion from opening 
     e.preventDefault(); 
    } 
}); 

utilisé le code de défilement de jQuery scroll to element