jQuery可以拖动滑动条快速跳转分页插件

jQuery可以拖动滑动条快速跳转分页插件1007
jQuery可拖动分页插件是一款具有滑动条,可以拖动滑动条快速跳转到任意页面,另外你也可以点击翻页图标来实现翻页,非常方便和实用。
$(document).ready( function() {      var pagesMax = 30;  var pagesMin = 1;  var startPage = 7;  var url = "http://sc.chinaz.com/jiaoben/";    $('.pagination .pageSlider').slider({    value: startPage, max: pagesMax, min: pagesMin,    animate: true,        : function( event, ui ) {            $('.pagination .pageSlider .ui-slider-handle').attr({        "aria-valuenow": startPage,        "aria-valuetext": "Page " + startPage,        "role": "slider",        "aria-valuemin": pagesMin,        "aria-valuemax": pagesMax,        "aria-describedby": "pageSliderDescription"       });             $('.pagination .pageInput').val( startPage );    }    }).on( 'slide', function(event,ui) {            // let user skip 10 pages with keyboard ;)      if( event.metaKey || event.ctrlKey ) {                if( ui.value > $(this).slider('value') ) {                    if( ui.value+9 < pagesMax ) { ui.value+=9; }           else { ui.value=pagesMax }          $(this).slider('value',ui.value);                } else {                    if( ui.value-9 > pagesMin ) { ui.value-=9; }           else { ui.value=pagesMin }          $(this).slider('value',ui.value);                  }                event.preventDefault();              }            $('.pagination .pageNumber span').text( ui.value );      $('.pagination .pageInput').val( ui.value );        }).on('slidechange', function(event, ui) {          $('.pagination .pageNumber')        .attr('role','alert')        .find('span')        .text( ui.value );          $('.pagination .pageInput').val( ui.value );            $('.pagination .pageSlider .ui-slider-handle').attr({        "aria-valuenow": ui.value,        "aria-valuetext": "Page " + ui.value       });      });$('.pagination .pageSlider .ui-slider-handle').on( 'keyup' , function(e) {    if( e.which == 13 ) {    var curPage = $('.pagination .pageSlider').slider('value');    alert( 'we would now send you to: ' + url.replace( /{{.}}/ , curPage ));  }  });$('.pagination .pageInput').on( 'change' , function(e) {  $('.pagination .pageSlider').slider( 'value', $(this).val() );});        var tmr;  $('.pageSkip').on('click', function(e) {        e.preventDefault();        var $this = $(this);        if( $this.hasClass('pageNext') ) {      var curPage = $('.pagination .pageSlider').slider('value')+1;    } else if( $this.hasClass('pagePrev') ) {      var curPage = $('.pagination .pageSlider').slider('value')-1;    }        $('.pagination .pageSlider').slider('value',curPage);        clearTimeout(tmr);    tmr = setTimeout( function() {      alert( 'we would now send you to: ' + url.replace( /{{.}}/ , curPage ));    },1000);      });        function sliderPips( min, max ) {    var pips = max-min;  var $pagination = $('.pagination .pageSlider');   for( i=0; i<=pips; i++ ) {    var s = $('<span class="pagePip"/>').css({       left: '' + (100/pips)*i + '%'     });        $pagination.append( s );  }    var minPip = $('<span class="pageMinPip">'+min+'</span>');  var maxPip = $('<span class="pageMaxPip">'+max+'</span>');  $pagination.prepend( minPip, maxPip );  };sliderPips( pagesMin, pagesMax ); function sliderLabel() {  $('.pagination .ui-slider-handle').append(    '<span class="pageNumber">Page <span>' +     $('.pagination .pageSlider').slider('value') +     '</span></span>');};sliderLabel();          $('.pagination .pageButton').on('click', function(e) {    e.preventDefault();    var curPage = $('.pagination .pageSlider').slider('value');    alert( 'we would now send you to: ' +           url.replace( /{{.}}/ , curPage ));    });            });

也许你还喜欢