Tengo una aplicación que usa la cuadrícula CSS que contendrá una cantidad variable de elementos de cuadrícula, aunque sabré el número de elementos en cada fila. ¿Existe una manera fácil de determinar el número de columna de un elemento determinado?
es decir. dados 32 elementos dispuestos en filas de 8, el elemento número 9 está en la columna 1, el elemento número 10 está en la columna dos.
Actualmente estoy haciendo esto:
function getColumn(itemIndex, colsPerRow) { // its in the last column if (itemIndex % colsPerRow === 0) { return colsPerRow; } return itemIndex - (Math.floor(itemIndex/colsPerRow) * colsPerRow); }Y devuelve la respuesta correcta, pero siento que hay una manera más simple de resolver esto.
Para tener en cuenta la numeración basada en 1:
column = (itemIndex - 1) % colsPerRow + 1 (no es necesario en la cláusula if )
Ya casi tiene la respuesta: recuento de columnas del módulo del número de artículo.
function getColumn(itemIndex, colsPerRow) { // its in the last column if (itemIndex % colsPerRow === 0) { return colsPerRow; } return itemIndex % colsPerRow; } console.log( getColumn(1,9), getColumn(2,9), getColumn(3,9), getColumn(4,9), getColumn(5,9), getColumn(6,9), getColumn(7,9), getColumn(8,9), getColumn(9,9), getColumn(10,9), getColumn(11,9) );