Переходы страниц с использованием JQuery?

Question

Мне нужно создать эффект слайд-перехода, используя JQuery при переключении страниц. Однако я не совсем уверен, с чего начать. Может ли кто-нибудь указать мне правильное направление? Если уже существует плагин, который делает это, можете ли вы указать на это?

Спасибо!

Answer 1

Вот очень очень простое решение.Он хранит страницы, которые вы хотите циклически просматривать, в массиве, и ссылки get next / prev просто проходят по ним.

HTML:

<a href = '#' id = 'getPrev'>Get Prev</a>
<div id = 'contentArea'></div>
<a href = '#' id = 'getNext'>Get Next</a>

jQuery:

var pages = array( "one.html", "two.html", "three.html" );
var curPage = 0;

$(function() {
    $("#getPrev").bind("click", function() {
        $("#contentArea").fadeOut();
        curPage--;
        if(curPage < 0) curPage = pages.length-1
        fetchPage(pages[curPage]);
    });
});

function fetchPage(page) {
    $.ajax({
        type: "GET",
        url: page,
        success: function(html) {
            $("#contentArea").html(html).fadeIn();
        }, 
        error: function(a,b,c) {  $("#contentArea").html("An Error Occured.").fadeIn(); }
    });
}

Привязка для ссылки 'getNext' будет аналогичной, за исключением направления, в котором вы идете.

Answer 2

jQuery Mobile - хорошо поддерживаемая библиотека, которая делает подобные вещи.Это было бы хорошее место, чтобы посмотреть, и даже может сделать то, что вам нужно сделать.