Buona sera a tutti!!! 
Come da titolo, vorrei aggiungere delle righe di codice a questo plugin per far sì che nel passaggio da un elemento della lista all'altro vi sia lo stesso effetto di transizione presente in quest'altro plugin, del quale vi riporto il codice e, evidenziate in grassetto e corsivo, le parti dello stesso che, apportando ovviamente le dovute modifiche, dovrebbero e sottolineo dovrebbero (non sono un'esperta, purtroppo! :crying fare al caso mio:
Questo invece è il codice relativo a Quick Pager nel quale vorrei implementare esclusivamente la funzione evidenziata sopra:
Nel dubbio mi scuso comunque fin d'ora per l'inserimento dei due link all'inizio del post, anche se da quanto ho capito, essendo gli stessi contestualizzati nel discorso, la cosa almeno in questo caso sarebbe a norma di regolamento, dico bene?
E naturalmente grazie in anticipo a tutti voi per la vostra attenzione e disponibilità!!!!!
Un saluto!
Jessy
Come da titolo, vorrei aggiungere delle righe di codice a questo plugin per far sì che nel passaggio da un elemento della lista all'altro vi sia lo stesso effetto di transizione presente in quest'altro plugin, del quale vi riporto il codice e, evidenziate in grassetto e corsivo, le parti dello stesso che, apportando ovviamente le dovute modifiche, dovrebbero e sottolineo dovrebbero (non sono un'esperta, purtroppo! :crying
fare al caso mio:
Codice:
/**
*
* Text Pager - jQuery plugin for create pages on div
* Copyright (c) 2014 Dmitrij Waśkowski
*
* Licensed under the MIT license:
* http://www.opensource.org/licenses/mit-license.php
*
* Project home:
* https://github.com/dwaskowski/jquery_textpager
*
* Version: 1.0
*
*/
!function(e, t, o, n) {
e.fn.textpager = function(options) {
var parent = $('<div>').insertBefore($(this));
$(this).css('overflow','hidden').appendTo($(parent));
var eOptions = {
controlArrows: (typeof(options) !== "undefined" && options !== null && typeof(options.controlArrows) !== "undefined" && options.controlArrows !== null) ? options.controlArrows : '',
controlArrowsEnabel: (typeof(options) !== "undefined" && options !== null && typeof(options.controlArrowsEnabel) !== "undefined" && options.controlArrowsEnabel !== null) ? options.controlArrowsEnabel : true,
controlPages: (typeof(options) !== "undefined" && options !== null && typeof(options.controlPages) !== "undefined" && options.controlPages !== null) ? options.controlPages : '',
controlPagesEnabel: (typeof(options) !== "undefined" && options !== null && typeof(options.controlPagesEnabel) !== "undefined" && options.controlPagesEnabel !== null) ? options.controlPagesEnabel : true,
controlPagesContent: (typeof(options) !== "undefined" && options !== null && typeof(options.controlPagesContent) !== "undefined" && options.controlPagesContent !== null) ? options.controlPagesContent : 'div'
};
var fulltextHeight = 0;
$(this).children().each(function(){
fulltextHeight += $(this).height();
});
var textareaHeight = $(this).height();
var textareaWidth = $(this).width();
if(textareaHeight<fulltextHeight){
var pageNow = 1;
var margTop = 0;
var pages = Math.ceil(fulltextHeight/textareaHeight);
if (eOptions.controlArrows==='') {
$('<div>').addClass('tp-control-arrows').appendTo($(parent));
eOptions.controlArrows = $(parent).find('.tp-control-arrows');
$('<a>').addClass('tp-control-arrow-left').addClass('unactive').html('<span><</span>').appendTo($(eOptions.controlArrows));
$('<a>').addClass('tp-control-arrow-right').html('<span>></span>').appendTo($(eOptions.controlArrows));
}
if (eOptions.controlPages==='') {
$('<div>').addClass('tp-control-pages').appendTo($(parent));
eOptions.controlPages = $(parent).find('.tp-control-pages');
}
var controlElements = '';
for (var pageCount=0;pageCount<pages;pageCount++) {
controlElements += $('<'+eOptions.controlPagesContent+'>')
.attr('data-page',''+(pageCount+1))
.html('<span>'+(pageCount+1)+'</span>')
.addClass('tp-page')
.addClass(!pageCount ? 'active' : '')
.prop("outerHTML");
}
$(eOptions.controlPages).html(controlElements);
$(this).css('height',textareaHeight+'px').css('padding',0);
var contentHtml = $(this).html();
$(this).html('');
$('<div>').addClass('tp-horizontalbox').css('height',textareaHeight+'px').css('width',textareaWidth+'px').appendTo($(this));
$('<div>').addClass('tp-vertivalbox').html(contentHtml).css('width',textareaWidth+'px').appendTo($(this).find('.tp-horizontalbox'));
var self = this;
$(eOptions.controlArrows).find('.tp-control-arrow-left').unbind('click').click(function(){
var thisPage = pageNow-1;
if(thisPage<1){
return;
}
if(thisPage==1){
$(this).addClass('unactive');
}
$(eOptions.controlArrows).find('.tp-control-arrow-right').removeClass('unactive');
var nextPage = (thisPage-pageNow)*textareaHeight;
margTop -= nextPage;
pageNow = thisPage;
$(eOptions.controlPages).find(eOptions.controlPagesContent+'.tp-page').removeClass('active');
$(eOptions.controlPages).find(eOptions.controlPagesContent+'[data-page="'+thisPage+'"]').addClass('active');
[B][I][COLOR="#FF0000"]self.animateStep(self, textareaWidth, margTop, false);[/COLOR][/I][/B]
});
$(eOptions.controlArrows).find('.tp-control-arrow-right').unbind('click').click(function(){
var thisPage = pageNow+1;
if(thisPage>pages){
return;
}
if(thisPage==pages){
$(this).addClass('unactive');
}
$(eOptions.controlArrows).find('.tp-control-arrow-left').removeClass('unactive');
var nextPage = (thisPage-pageNow)*textareaHeight;
margTop -= nextPage;
pageNow = thisPage;
$(eOptions.controlPages).find(eOptions.controlPagesContent+'.tp-page').removeClass('active');
$(eOptions.controlPages).find(eOptions.controlPagesContent+'[data-page="'+thisPage+'"]').addClass('active');
[B][I][COLOR="#FF0000"]self.animateStep(self, textareaWidth, margTop, true);[/COLOR][/I][/B]
});
$(eOptions.controlPages).find(eOptions.controlPagesContent+'.tp-page').unbind('click').click(function(){
var thisPage = $(this).data('page');
if(thisPage===pageNow) {
return;
}
var goAhead = true;
if(thisPage<pageNow) {
goAhead = false;
}
if (thisPage==1) {
$(eOptions.controlArrows).find('.tp-control-arrow-left').addClass('unactive');
$(eOptions.controlArrows).find('.tp-control-arrow-right').removeClass('unactive');
} else if(thisPage==pages) {
$(eOptions.controlArrows).find('.tp-control-arrow-right').addClass('unactive');
$(eOptions.controlArrows).find('.tp-control-arrow-left').removeClass('unactive');
} else {
$(eOptions.controlArrows).find('.tp-control-arrow-right').removeClass('unactive');
$(eOptions.controlArrows).find('.tp-control-arrow-left').removeClass('unactive');
}
var nextPage = (thisPage-pageNow)*textareaHeight;
margTop -= nextPage;
pageNow = thisPage;
$(eOptions.controlPages).find(eOptions.controlPagesContent+'.tp-page').removeClass('active');
$(this).addClass('active');
[B][I][COLOR="#FF0000"]self.animateStep(self, textareaWidth, margTop, goAhead);[/COLOR][/I][/B]
});
}
[B][I]this.animateStep = function(parent, textareaWidth, margTop, goAhead){
$(parent).find('.tp-horizontalbox')
.animate({
marginLeft: (goAhead ? "-="+textareaWidth : "+="+textareaWidth)
}, 400, function(){
$(this)
.css({
marginLeft: (goAhead ? "+="+(textareaWidth*2) : "-="+(textareaWidth*2))
})
.find('.tp-vertivalbox')
.css({
marginTop: margTop
});
$(this)
.animate({
marginLeft: (goAhead ? "-="+textareaWidth : "+="+textareaWidth)
}, 400)
.find('.tp-vertivalbox')
.animate({
opacity: 1
}, 400);
})
.find('.tp-vertivalbox')
.animate({
opacity: 0
}, 400);
}[/I][/B]
};
}(jQuery, window, document);
Codice:
(function($) {
$.fn.quickPagination=function(options) {
var defaults = {
pageSize: 10,
currentPage: 1,
holder: null,
pagerLocation: "after"
};
var options = $.extend(defaults, options);
return this.each(function() {
var selector = $(this);
var pageCounter = 1;
selector.wrap("<div class='simplePagerContainer'></div>");
selector.parents(".simplePagerContainer").find("ul.simplePagerNav").remove();
selector.children().each(function(i) {
if(i < pageCounter*options.pageSize && i >= (pageCounter-1)*options.pageSize) {
$(this).addClass("simplePagerPage"+pageCounter);
}
else {
$(this).addClass("simplePagerPage"+(pageCounter+1));
pageCounter ++;
}
});
selector.children().hide();
selector.children(".simplePagerPage"+options.currentPage).show();
if(pageCounter <= 1) {
return;
}
var pageNav = "<ul class='simplePagerNav'>";
for (i=1;i<=pageCounter;i++) {
if (i==options.currentPage) {
pageNav += "<li class='currentPage simplePageNav"+i+"'><a rel='"+i+"' href='#'>"+i+"</a></li>";
}
else {
pageNav += "<li class='simplePageNav"+i+"'><a rel='"+i+"' href='#'>"+i+"</a></li>";
}
}
pageNav += "</ul>";
if(!options.holder) {
switch(options.pagerLocation)
{
case "before":
selector.before(pageNav);
break;
case "both":
selector.before(pageNav);
selector.after(pageNav);
break;
default:
selector.after(pageNav);
}
}
else {
$(options.holder).append(pageNav);
}
selector.parent().find(".simplePagerNav a").click(function() {
var clickedLink = $(this).attr("rel");
options.currentPage = clickedLink;
if(options.holder) {
$(this).parent("li").parent("ul").parent(options.holder).find("li.currentPage").removeClass("currentPage");
$(this).parent("li").parent("ul").parent(options.holder).find("a[rel='"+clickedLink+"']").parent("li").addClass("currentPage");
}
else {
$(this).parent("li").parent("ul").parent(".simplePagerContainer").find("li.currentPage").removeClass("currentPage");
$(this).parent("li").parent("ul").parent(".simplePagerContainer").find("a[rel='"+clickedLink+"']").parent("li").addClass("currentPage");
}
selector.children().hide();
selector.find(".simplePagerPage"+clickedLink).show();
return false;
});
});
}
})(jQuery);E naturalmente grazie in anticipo a tutti voi per la vostra attenzione e disponibilità!!!!!
Un saluto!
Jessy
