2009-07-09 10 views
1

Je travaille avec le plugin ScrolTO jQuery: http://demos.flesler.com/jquery/scrollTo/ sur ce site: www.imfrom.meTravailler avec des sélecteurs jQuery - ScrollTo

J'ai les flèches pour naviguer vers le haut et vers le bas et à partir de maintenant, je me sers:

$('.down_stream').click(function(){ 
     $.scrollTo('#stream', 1500, {easing:'easeOutElastic'});  
    }); 

Donc, au clic de .down_stream aller à # flux, alias la flèche vers le bas pour vous amener à diffuser. J'ai essayé de lire et de comprendre un sélecteur jQuery pour prendre soin de cela pour passer au segment SUIVANT sans copier/coller cet extrait 15+ fois pour les mouvements de haut en bas.

Je n'arrivais à rien comprendre. Chaque segment est enveloppé dans ce bloc:

<div id="stream" class="box"> 
     <div class="grid_12 arrow up_home"> 
      &uarr; 
     </div> 
     <div class="grid_2"><div class="number-heading">01.</div></div> 
     <div class="grid_10"> 
      <h2 class="content_title">what's been new?</h2> 

      <p>Blah blah blah blah...</p> 
     </div> 
     <div class="grid_12 arrow down_about"> 
      &darr; 
     </div> 
    </div><!-- end strean --> 

Répondre

0

pas un expert jQuery, mais je vais lui donner un coup de poignard. Si je comprends bien, c'est la partie '#stream' qui doit changer chaque fois que vous cliquez sur la flèche haut/bas. Donc chaque div aura un identifiant différent et vous avez besoin de nourrir ceux-ci à ce petit extrait pour le faire défiler?

Utilisez un tableau et un entier var pour garder une trace du chemin à parcourir dans le tableau.

//initialize the array w/ your 15 div names 
var divNames = ["#stream", "#nextDivName", "#andTheNext", "#yetAnotherDivName"]; 

var index = 0; 

function moveUp() 
{ 
    if((index - 1) >= 0){index--;} 
    move(index); 
} 
function moveDown() 
{ 
    if((index + 1) < (divNames.length)){index++;} 
    move(index); 
} 
function move(p_Index) 
{ 
    $.scrollTo(divNames[p_Index], 1500, {easing:'easeOutElastic'}); 
} 

clique le bouton d'appel maintenant les fonctions moveUp() & moveDown().

Espérons que ça aide.