Creați elemente de redimensionare automată cu Scalable.js
Dacă ai nevoie să face elemente flexibile care își umple automat recipientele Mi-ar recomanda foarte Scalable. Acest script gratuit open source JS este perfect pentru crearea unui design fluid fără prea multă stres.
Totul din biblioteca Scalable.js este maleabil, astfel încât să puteți modifica stilul, dimensiunea, poziția și conținutul fiecărui container. Aveți nevoie de elemente aliniate la partea de sus sau de jos a paginii? Scalable are opțiuni pentru asta.
Luați o privire la repo GitHub pentru a afla mai multe despre cum funcționează acest lucru.
În forma sa cea mai de bază, acest script ia un element de pagină țintă împreună cu câteva opțiuni pentru personalizarea afișajului. Iată câteva exemple de coduri preluate direct de la GitHub:
var scalabil = nou Scalabil (containerEl, opțiuni);
În mod firesc, primul parametru este oricare element de container pe care îl vizați (în mod ideal a Parametrul opțiunilor ar trebui să ia o serie de perechi de chei => valoare. Aceste opțiuni includ înălțimea containerului, lățimile min și max, împreună cu scările min și max (adică cât de mult se poate scala cu elementele interne). Priviți pagina principală a proiectului pentru o demonstrație utilizabilă. Puteți trage colțurile containerului pentru a redimensiona automat elementul flexibil din interior. Acest lucru este destul de rece, deoarece sub această zonă veți găsi codul utilizabil luate direct din pagină. Există modalități de a manipula elemente flexibile doar cu CSS pur. Cu toate acestea, aceste metode se pot simți datate și nu oferă control la fel de mult ca JavaScript. Dacă doriți să încercați acest lucru, luați o copie de la GitHub și vedeți ce credeți. Scalable este încă în curs de dezvoltare, dar este un script ușor de editat pentru nevoile dvs..
