Imposition 2-up : Différence entre versions

De Design numérique
Aller à : navigation, rechercher
Ligne 1 : Ligne 1 :
 +
À utiliser dans une mise en page type paged.js. 
 +
Attention, pour octomode, prendre l'URL de l'iframe où se trouve réellement les pages! 
 +
Copier/coller le tout dans la Console de l'Inspecteur d'élément.
 +
 
<syntaxhighlight lang="javascript">
 
<syntaxhighlight lang="javascript">
 
container = document.getElementsByClassName("pagedjs_pages")[0];
 
container = document.getElementsByClassName("pagedjs_pages")[0];
Ligne 15 : Ligne 19 :
 
// on enregistre dans un nouvel Array à chaque fois la première page, la dernière page, et on les enlève de la première liste de pages.
 
// on enregistre dans un nouvel Array à chaque fois la première page, la dernière page, et on les enlève de la première liste de pages.
 
for(p = 0; p < nb_pages; p++){
 
for(p = 0; p < nb_pages; p++){
     new_pages.push(pages[0]);
+
     if(p%2) {
    pages.shift();
+
    new_pages.push(pages[0]);
     new_pages.push(pages[pages.length - 1]);
+
    pages.shift();
    pages.pop();
+
    new_pages.push(pages[pages.length - 1]);
 +
    pages.pop();
 +
     } else {
 +
    new_pages.push(pages[pages.length - 1]);
 +
    pages.pop();
 +
        new_pages.push(pages[0]);
 +
    pages.shift();
 +
    }
 +
   
  
 
}
 
}
Ligne 26 : Ligne 38 :
 
     new_pages[p].style.order = p;
 
     new_pages[p].style.order = p;
 
}
 
}
 +
 
</syntaxhighlight>
 
</syntaxhighlight>

Version du 20 décembre 2022 à 20:51

À utiliser dans une mise en page type paged.js. Attention, pour octomode, prendre l'URL de l'iframe où se trouve réellement les pages! Copier/coller le tout dans la Console de l'Inspecteur d'élément.

container = document.getElementsByClassName("pagedjs_pages")[0];
container.style.display = "flex";

// on enlève la marge de gauche de la première page
firstpage = document.getElementsByClassName("pagedjs_first_page")[0];
firstpage.style.marginLeft = 0;

// on met le div pagedjs_page en "display:flex" pour pouvoir changer l'ordre des pages
pages = [].slice.call(document.getElementsByClassName("pagedjs_page"));
nb_pages = pages.length;

new_pages = []

// on enregistre dans un nouvel Array à chaque fois la première page, la dernière page, et on les enlève de la première liste de pages.
for(p = 0; p < nb_pages; p++){
    if(p%2) {
    	new_pages.push(pages[0]);
    	pages.shift();
    	new_pages.push(pages[pages.length - 1]);
    	pages.pop();	
    } else {
    	new_pages.push(pages[pages.length - 1]);
    	pages.pop();
        new_pages.push(pages[0]);
    	pages.shift();
    }
    

}

// On applique en CSS l'ordre des pages de la nouvelle liste de pages
for (p=0; p < new_pages.length; p++) {
    new_pages[p].style.order = p;
}