JSFiddle - React, Tailwind, and code Playground

by jakirseu

HTML

<body>
    <div class="pagination">
        <p>The House of Representatives shall be composed of Members chosen every
            second Year by the People of the several States, and the Electors in each
            State shall have the Qualifications requisite for Electors of the most
            numerous Branch of the State Legislature.</p>
        <p>No Person shall be a Representative who shall not have attained to the
            Age of twenty five Years, and been seven Years a Citizen of the United
            States, and who shall not, when elected, be an Inhabitant of that State
            in which he shall be chosen.</p>
        <p>(Representatives and direct Taxes shall be apportioned among the several
            States which may be included within this Union, according to their respective
            Numbers, which shall be determined by adding to the whole Number of free
            Persons, including those bound to Service for a Term of Years, and excluding
            Indians not taxed, three fifths of all other Persons.) (The previous sentence
            in parentheses was modified by the 14th Amendment, section 2.) The actual
            Enumeration shall be made within three Years after the first Meeting of
            the Congress of the United States, and within every subsequent Term of
            ten Years, in such Manner as they shall by Law direct. The Number of Representatives
            shall not exceed one for every thirty Thousand, but each State shall have
            at Least one Representative; and until such enumeration shall be made,
            the State of New Hampshire shall be entitled to chuse three, Massachusetts
            eight, Rhode Island and Providence Plantations one, Connecticut five, New
            York six, New Jersey four, Pennsylvania eight, Delaware one, Maryland six,
            Virginia ten, North Carolina five, South Carolina five and Georgia three.</p>
        <p>When vacancies happen in the...

CSS

.pagination {
    width:500px;
    height:200px;
    overflow:hidden;
}

JavaScript

$(document).ready(function () {
        var prev = $('.pagination').height();
        $('.pagination').children().wrapAll('<div class="content"/>');
        $('.next').click(function () {
            var current = ($('.content').css('margin-top') || '0px');
            $('.content').css('margin-top', current.substring(0, current.length - 2) - $('.pagination').height() + 'px');
            prev = current.substring(0, current.length - 2);
        });

        $('.pre').click(function () {
            var current = ($('.content').css('margin-top'));

            $('.content').css('margin-top', prev + 'px');
        });
    });