2010-02-10 6 views
0

J'utilise jQuery scrollTo pour faire défiler le contenu d'une div qui est survolée. Lorsque je clique sur les liens, le div fera défiler verticalement son contenu. Cependant, je voudrais que cet effet se produise lorsque je survole les liens, au lieu de cliquer dessus.défilement vertical en survol au lieu de cliquer? jquery api

Je ne crois pas que ce soit une option avec scrollTo de jQuery. Cependant, il existe une méthode d'API jQuery pour l'événement hover.

Cela peut sembler être une simple question, mais y a-t-il un moyen de maintenir ma fonctionnalité de défilement vertical de "scrollTo" en survolant au lieu de cliquer?

défilement vertical:

jQuery(function ($) { 
    $.localScroll.defaults.axis = 'y'; 
    $.localScroll({ 
     target: '#content', 
     // could be a selector or a jQuery object too. 
     queue: true, 
     duration: 500, 
     hash: false, 
     onBefore: function (e, anchor, $target) { 
      // The 'this' is the settings object, can be modified 
     }, 
     onAfter: function (anchor, settings) { 
      // The 'this' contains the scrolled element (#content) 
     } 
    }); 
}); 

Planant:

$("#page-wrap li.button").hover(function(){ /* vertically slide here? */ });V 

Répondre

1

défilement doux avec le plugin scrollTo:

 $('#page-wrap li.button-down').hover(function(){ 
      var scrollDistance = $('body').scrollTop(); 
      var scrollHeight = $('#content').height(); 
      var windowHeight = $('body').height(); 
      var scrollSpeed = (scrollHeight - scrollDistance - windowHeight) * 2.5; // higher than 2.5 is slower, lower is faster 
      $('body').scrollTo('100%', scrollSpeed); 
     },function(){ 
      $('body').stop().scrollTo('+=20px', 100); 
      // stop on unhover 
     }); 

Cela défiler vers le bas. Il est plus simple de faire le défilement vers le haut bouton

 $('#page-wrap li.button-up').hover(function(){ 
      var scrollDistance = $('body').scrollTop(); 
      var scrollSpeed = scrollDistance * 2.5; // higher than 2.5 is slower, lower is faster 
      $('body').scrollTo('0px', scrollSpeed); 
     },function(){ 
      $('body').stop().scrollTo('-=20px', 100); 
      // stop on unhover 
     }); 

exemple violon: http://jsfiddle.net/8Nkpr/1/