Comment faire défiler vers la gauche sur html?

Question

Je construis un site Web d'une seule page. J'ai des choses communes sur le site web comme: services, portfolio, contact, blog, etc.

Si quelqu'un clique sur le menu de navigation pour 'services', 'portefeuille' et 'contact', il défile vers l'élément que l'utilisateur veut . Normalement, il s'agit d'un défilement haut et bas, donc il n'y a pas de problème. L'idée que j'ai est quand l'utilisateur veut aller au blog, il fait défiler vers la droite ou faire un effet de poussée du blog venant de la droite vers la gauche. Je sais que j'ai quelque chose qui marche. Le problème est que quand je suis sur la dernière section, qui est le contact, c'est au bas de la page. Si je veux aller sur le blog, il fait défiler vers le haut, puis vers la droite pour voir le blog. Je fais semblant d'enlever ce défilement vers le haut, et fais juste un défilement à droite et vois la section du blog en haut.

Une idée sur la façon de gérer cela? Ou serait-il préférable d'avoir un fichier html indépendant?

Modifier

http://jsfiddle.net/VS9dS/20/

défilement de blog à une section et/ou passer d'une section vers le haut ou vers le bas.

$('html, body').animate({scrollLeft: -$(sectionName).offset().left}, "slow"); 
$('html, body').animate({scrollTop: $(sectionName).offset().top}, "slow"); 

défiler de toute section au blog:

$('html, body').animate({scrollTop: $(sectionName).offset().top}, "slow");}; 
$('html, body').animate({scrollLeft: $(sectionName).offset().left}, "slow"); 

Je n'ai pas ajouté beaucoup de code pour le manque de temps. En ce moment travaille sur mon code que si je suis sur la section de contact et que je clique sur le blog, il défile vers le haut puis défile vers la section du blog, et la section du blog ressemble à un html complet. Ce que je voudrais faire est la section si je suis sur le contact et cliquez sur le blog juste faire un rouleau de gauche et montrer le haut du blog, et de la même manière si je suis sur les services, la maison

Answer 1

Si je vous ai droit et vous voulez juste d'abord animer une chose et puis l'autre, vous pourriez faire quelque chose comme ceci:

$('html, body').animate({ 
    scrollTop: $(sectionName).offset().top 
}, "slow", function() { 
    $('html, body').animate({ 
     scrollLeft: $(sectionName).offset().left 
    }, "slow"); 
}); 

... ou je peux essayer de nouveau et que vous vouliez animer un rouleau à le droit après le défilement vers le haut. Ensuite, vous pouvez le faire:

$('a[href=#blog]').click(function() { 
    $('html, body').animate({ 
     scrollTop: $('#home').offset().top 
    }, "slow", function() { 
     $('html, body').animate({ 
      left: '-=200px' 
     }, "slow",'linear'); //looks better I guess 
    }); 
}); 

CSS:

body { 
    position: relative; 
} 

Fiddle: http://jsfiddle.net/Matze/eRNde/

http://api.jquery.com/animate/#basic-usage