Column Resizer JS

Dette verktøyet genererer et bærbart, klart-til-bruk kolonnejusteringsskript for HTML-tabeller. Det henvender seg til frontend-utviklere og produktteam som bygger datapaneler, admin-dashboards eller analysevisninger der kolonnebredder må tilpasses innhold og brukerpreferanser. Utdata er et selvstendig JavaScript-snippet med valgfritt CSS som kan limes inn i ethvert prosjekt uten ytre avhengigheter. Inndata inkluderer en CSS-selektor for mål-tabellen og konfigurasjon for startbredder og begrensninger. Resultatet støtter vedvarende layout via localStorage og fungerer i både RTL- og LTR-layouter. Det passer til statiske tabeller og dynamiske datasett og håndterer varierende vindusstørrelser robust.

Verktøyet utfører konseptuelt tre oppgaver: (1) lese og låse innledende kolonnebredder, (2) sette inn dragebare splitter mellom kolonner, og (3) oppdatere bredder under dragging samtidig som minimumsbredder og tabellens integritet opprettholdes. Kjernlogikken oppretter per-kolonne håndtak, overvåker museinteraksjoner, beregner nye bredder i px eller prosent og oppdaterer inline-stiler eller en colgroup. Den unngår layout-ramming ved debouncing av oppdateringer og bruker requestAnimationFrame for jevn dragging. Hvis kolonneinnhold endres programmert, kan snutten synkronisere bredder igjen.

Målgrupper inkluderer frontend-ingeniører som integrerer resizable tabeller, UX-designere som vurderer adaptive layouter og QA-team som verifiserer cross-browser-adferd. Verdien ligger i en testet, plug‑and‑play-løsning med klare konfigurasjonsvalg, forutsigbare resultater og lav integrasjonsinnsats. Unike kjennetegn inkluderer støtte for minimale kolonnebredder, valgfri persistens, RTL-bevissthet og en kompatibilitetsmodus for tabeller med eksisterende colgroup-definisjoner. Den gir også konsise utdata som kan tilpasses til egne stylingtokens.