glisser entre les pages à l'aide de jQuery

J'ai un 4 page de site web et je veux la transition entre le 4 pages avec une diapositive effet. Je ne veux pas le faire à l'aide d'un #ID. Je veux appuyer sur un bouton ou sur le lien à la diapositive de la page suivante. Je sais que cela peut être fait à l'aide de jQuery et j'ai vu des sites qui font cela. S'il vous plaît aider. Merci d'avance pour toutes suggestions, critiques et commentaires.

Que voulez-vous dire que vous ne voulez pas utiliser un ID? vous voulez dire que vous voulez la transition pour arriver sur le chargement d'une nouvelle page html?
Exactement @AndresIlich. La réponse de josé ci-dessous montre l'effet de l'action, mais utilise les Id et non des pages html. Des idées?

OriginalL'auteur Asif Syed | 2012-03-01

  1. 8

    Découvrez ce tutoriel et exemple
    http://www.queness.com/post/356/create-a-vertical-horizontal-and-diagonal-sliding-content-website-with-jquery

    Fondamentalement, vous devez définir vos CSS et HTML pour disposer de tous les panneaux et écrans que vous voulez que les divs - lignes et de colonnes.

    Ensuite définir un sélecteur pour chaque panneau et de la lier à un événement de clic [Code de lien].

    $(document).ready(function() {

    //get all link with class panel
    $('a.panel').click(function () {

                //reset and highlight the clicked link
        $('a.panel').removeClass('selected');
        $(this).addClass('selected');

        //grab the current item, to be used in resize function
        current = $(this);

                //scroll it to the destination
        $('#wrapper').scrollTo($(this).attr('href'), 800);      

                //cancel the link default behavior
        return false;
    });


    //resize all the items according to the new browser size
    $(window).resize(function () {

        //call the resizePanel function
        resizePanel();
    });

});

    OriginalL'auteur jose

  2. 3

    Je suggère d'utiliser jQuery pour faire glisser votre contenu hors de l'écran, après que ce soit fait d'utiliser AJAX pour actualiser le contenu de votre nouvelle page. Définir le contenu de l'autre côté de l'écran et utiliser jQuery de nouveau pour la faire glisser dans de ce côté.

    Quelque chose comme ça...

    <div id='wrapper'> //this has a set width and overflow hidden
  <div id='content'>
    your content
  </div>
</div>

    Un utilisateur clique sur un lien, animer la marge de 'contenu' il en va de la page. Faites votre AJAX-ing, la position du "contenu" de l'autre côté de la page (assez loin de sorte que vous ne pouvez pas le voir), d'animer la marge pour qu'elle glisse dans la vue.

    OriginalL'auteur Luke