140317 140318 140319 : développement en cours

Formulaire pour générer une sélection CSS d'enfants par rang

Prototype to do :

action borne finale ; alternative CSS à flex ; borne/numéro de rang négatif d'enfant à l'origine ; association d'un facteur d'intervalle à la borne finale ; indication du nombre d'item sélectionnés ; valeur de n par 'li' ; accessibilité : bouton de validation et ARIA ! courbe svg ?? à relier à déclinaison ? habillage…

Utilisation

Fixer le facteur de l'intervalle "i" entre les enfants via les boutons radio.

Fixer le numéro de rang de l'enfant à l'origine "o" via les boîtes de sélection "borne initiale" et "borne finale"
(la "borne initiale" avec un facteur d'intervalle positif, est l'enfant le plus à gauche, mais à droite avec un facteur d'intervalle négatif ; pour la "borne finale", c'est ainsi l'inverse - noter que les bornes peuvent ne pas avoir d'existence dans le DOM quand le rang est calculé en-dehors des limites de la collection d'éléments où la sélection s'opère ; exemple, 2n-5 commence visiblement à 1 comme 2n+1, mais virtuellement à -5 : [-5,-3,-1,1,3,5,7,…]) (**)

L'on obtient une sélection calculée selon "in+o"(*) et le second formulaire peut donner à comparer.

Facteur d'intervalle i :

Numéro de rang à l'origine o :
  1.  
  2.  
  3.  
  4.  
  5.  
  6.  
  7.  
  8.  
  9.  
  10.  
  11.  
  12.  
  13.  
  14.  
  15.  
  16.  
  17.  
  18.  
  19.  
  20.  
  21.  
  22.  
  23.  
  24.  
  25.  
  26.  
  27.  
  28.  
  29.  
  30.  
  31.  
  32.  
  33.  
  34.  
  35.  
  36.  
  37.  
  38.  
  39.  
  40.  
  41.  
  42.  
  43.  
  44.  
  45.  
  46.  
  47.  
  48.  
  49.  
  50.  
  51.  
  52.  
  53.  
  54.  
  55.  
  56.  
  57.  
  58.  
  59.  
  60.  
  61.  
  62.  
  63.  
  64.  
  65.  
  66.  
  67.  
  68.  
  69.  
  70.  
  71.  
  72.  
  73.  
  74.  
  75.  
  76.  
  77.  
  78.  
  79.  
  80.  
  81.  
  82.  
  83.  
  84.  
  85.  
  86.  
  87.  
  88.  
  89.  
  90.  
  91.  
  92.  
  93.  
  94.  
  95.  
  96.  
  97.  
  98.  
  99.  
  100.  
  101.  
  102.  
  103.  
  104.  
  105.  
  106.  
  107.  
  108.  
  109.  
  110.  
  111.  
  112.  
  113.  
  114.  
  115.  
  116.  
  117.  
  118.  
  119.  
  120.  
 

(*) CSS applique une fonction de type mathématique "ax + b", ou "in+o" dans notre cas, avec :
dans le rôle du coefficient directeur a : le facteur d'intervalle i ;
dans le rôle de l'ordonnée à l'origine b : le rang de l'enfant à l'origine ;
dans le rôle de la variable x : l'argument n que CSS paramètre automatiquement en partant de 0 puis en rajoutant 1 (les paramètres sont des nombres entiers supérieurs ou égal à zéro)

(**) décompte virtuel qui semble limité au milliard d'après tests Firefox et Chrome Mac : :nth-child(-999999999n+1000000000) fonctionne - équivaut à nth-child(1) - mais pas nth-child(-9999999999n+10000000000)