{source}
<title>Paginación con PHP, Mysql, jQuery, Ajax y Bootstrap </title>
<!– Latest compiled and minified CSS –>
<link rel=»stylesheet» href=»https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css»>
<!– Optional theme –>
<link rel=»stylesheet» href=»https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css»>
<div class=»container-fluid»>
<div class=»row»>
<div class=»col-xs-12″>
<h3> Listado de Países </h3>
<div id=»loader» class=»text-center»> <img src=»loader.gif»></div>
<div class=»outer_div»></div><!– Datos ajax Final –>
</div>
</div>
</div>
<!– jQuery (necessary for Bootstrap’s JavaScript plugins) –>
<script src=»https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js»></script>
<!– Latest compiled and minified JavaScript –>
<script src=»https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js»></script>

<script>
$(document).ready(function(){
load(1);
});

function load(page){
var parametros = {«action»:»ajax»,»page»:page};
$(«#loader»).fadeIn(‘slow’);
$.ajax({
url:’paises_ajax.php’,
data: parametros,
beforeSend: function(objeto){
$(«#loader»).html(«<img src=’loader.gif’>»);
},
success:function(data){
$(«.outer_div»).html(data).fadeIn(‘slow’);
$(«#loader»).html(«»);
}
})
}
</script>
{/source}