faites défiler jusqu'à l'élément horizontal div

J'ai une horizontale div:

faites défiler jusqu'à l'élément horizontal div

j'ai besoin pour faire défiler jusqu'à l'élément spécifique dans ce div en JavaScript bouton (après le clic div doit être fait défiler jusqu'à l'élément). Comment puis-je faire cela?

<div class="group" id="frames">
<div class="item frames-item">
<img src="1.jpg">
</div>
<div class="item frames-item">    
<img src="2.jpg">
</div>
....
....
</div>
ce code avez-vous essayé?

OriginalL'auteur ysokolovsky | 2013-07-10

  1. 10

    $.scrollTo est votre ami:

    $(container).scrollTo(target)
    merci, mais j'ai besoin de le faire sans plugins
    pourquoi? Puis juste inspecter ce scrollTo, et répliquer.
    Super, mais que la page liée est manquant.
    merci pour le tuyau, j'ai mis à jour la réponse avec le lien actuel ^^

    OriginalL'auteur moonwave99

  2. 5

    Essayez-dessous de la fonction d'élément ou d'une batterie li dans le centre de cliquer sur

    function centerItVariableWidth(target, outer){
  var out = $(outer);
  var tar = $(target);
  var x = out.width();
  var y = tar.outerWidth(true);
  var z = tar.index();
  var q = 0;
  var m = out.find('li');
  //Just need to add up the width of all the elements before our target. 
  for(var i = 0; i < z; i++){
    q+= $(m[i]).outerWidth(true);
  }
  out.scrollLeft(Math.max(0, q - (x - y)/2));
}
    Grande fonction simple pour les listes.

    OriginalL'auteur Amit

  3. 2
    $(".ui-jqgrid-bdiv").scrollLeft(400);

    En jqgrid ainsi que des div

    OriginalL'auteur Hemant

  4. 1

    Si vous avez un élément qui, intérieure horizontale de défilement, vous pouvez faire en tant que suivi par mon exemple: Deux flèches avec des classes qui sont utilisées, de défilement de l'élément côtés.

    Dans ce cas, j'ai la classe .les onglets qui j'ai besoin de bouger. La 500 est le temps en millisecondes pour animer ce parchemin, de sorte que vous pouvez avoir votre propre curseur..

    var scroll = 0;
  $('.js-move-list-right').click(function(){
    scroll = scroll + 400;
    $('#timeline .tabs').animate({scrollLeft: scroll}, 500);
  });
  $('.js-move-list-left').click(function(){
      scroll = scroll - 400;
      $('#timeline .tabs').animate({scrollLeft: scroll}, 500);

  });

    OriginalL'auteur Lukas Alarcon