jQuery Simple Pagination
Simple plugin for pagination with radio input
5kb (3kb JS & 2kb CSS)
Demo
Usage

Include jquery.simple-pagination.css to head

<link href="/dist/css/jquery.simple-pagination.min.css" rel="stylesheet">

Include jQuery and SimplePagination

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="/dist/js/jquery.simple-pagination.min.js"></script>

Add container for pagination

<div id="container"></div>

Initialize plugin

$(document).ready(function(){
    $('#container').simplePagination({
        current: 7
        count: 14
        name: 'page'
    });
});

After init plugin add in container this html:

<!-- <div id="container"> -->
    <div class="simple-pagination">...</div>
    <div class="simple-pagination-radio">
        <input type="radio" name="page" value="1">
        <input type="radio" name="page" value="2">
        ...
        <input type="radio" name="page" value="14">
    </div>
<!-- </div> -->

Init and subscribe to changes

$(document).ready(function(){
    $('#container').simplePagination({
        current: 7,
        count: 14,
        name: 'page'
    });
    $('#container input[name=page]').change(function() {
        console.log($(this).val());
    });
});

Init with "mirrorContainer"

<div id="container"></div>
<div class="catalog">...</div>
<div id="mirror"></div>

$(document).ready(function(){
    $('#container').simplePagination({
        current: 7,
        count: 14,
        name: 'page',
        mirrorContainer: '#mirror'
    });
});