Loading...CSSRegions.js to eksperymentalny wypełniacz umożliwiający dzięki JavaScriptowi korzystanie z regionów CSS (CSS Regions) w przeglądarkach, które jeszcze ich nie obsługują.
Skrypt jest dostępny dla przeglądarek iOS 4+, Android 4+, Firefox, Chrome oraz Safari 5+.
Sposób użycia CSSRegions.js
Należy pobrać plik cssregions.js i dołączyć go do strony.
<body> ... <script src="cssregions.js"></script> </body>
W arkuszu stylów własności CSS należy poprzedzać przedrostkiem -adobe-:
#content{
-adobe-flow-into: myFlow;
}
.region{
-adobe-flow-from: myflow;
}
Nie trzeba niczego konfigurować. Wystarczy po prostu wczytać skrypt wypełniacza, który automatycznie znajdzie deklaracje dotyczące regionów CSS oraz odpowiednio je przetworzy i zastosuje. Jeśli przeglądarka obsługuje regiony CSS, wypełniacz nie zostanie uruchomiony, aby mogły zadziałać algorytmy przeglądarki.
Obsługa skryptu przez przeglądarki
- iOS 4+
- Android 4+
- Firefox
- Google Chrome
- Safari 5+
Ograniczenia
Wypełniacz CSSRegions.js jest skryptem eksperymentalnym, którego zadaniem jest zademonstrować podstawową funkcjonalność obszarów CSS. Imituje tę funkcjonalność (zgodnie ze specyfikacją CSS Regions W3C) przy użyciu JavaScriptu. Użycie tego języka sprawia, że wypełniacz działa wolniej niż standardowa implementacja przeglądarki.
Nie zaleca się używania skryptu CSSRegions.js w środowisku produkcyjnym jako zastępstwa dla standardowych algorytmów przeglądarki.
Wypełniacz rozpoznaje przedrostek -adobe- w składni CSS i CSSOM.
Składnia CSS
- Deklaracja
-adobe-flow-into: IDENTzbiera treść w nazwany układ - Deklaracja
-adobe-flow-from: IDENTrenderuje treść z nazwanego układu
Składnia CSSOM i zdarzenia
- Metoda
document.getNamedFlows()zmienia nazwę nadocument.adobeGetNamedFlows() - Zdarzenie
regionlayoutupdatezmienia się wadoberegionlayoutupdate - Własność
regionOversetzmienia się wadobeRegionOverset
Znane problemy ze skryptem
Znanych jest kilka ograniczeń tego eksperymentalnego skryptu:
- Zapytania o media — wypełniacz nie reaguje automatycznie na zmiany określone przez zapytania o media;
- DOM — wypełniacz nie reaguje automatycznie na zmiany w strukturze dokumentu;
- Zdarzenia — wypełniacz rozbija węzły DOM, aby rozdzielić je na obszary. Może to mieć wpływ na procedury obsługi zdarzeń powiązane z tymi węzłami;
- Stylizowanie obszarów — aktualnie bloki @region nie są obsługiwane;
Rozwiązanie problemu ze zmianą struktury dokumentu
Wypełniacz można zmusić do ponownego rozmieszczenia elementów wywołując w skrypcie metodę CSSRegions.doLayout() po dokonaniu zmian w arkuszach stylów lub elementach dokumentu.
<script> // Dodanie elementów do dokumentu // następnie CSSRegions.doLayout() </script>
Dokumentacja
Pomoc w rozwijaniu skryptu
Kod źródłowy wypełniacza CSSRegions.js znajduje się w serwisie GitHub. Pomoc w pisaniu kodu jest mile widziana, ale przed rozpoczęciem pracy należy przeczytać wskazówki dotyczące pisania kodu.
Licencja
Apache License 2.0
Wysyłam...
Komentarzy: 2
zigg
02.18.2013
„CSSRegions.js to eksperymentalny wypełniacz umożliwiający dzięki JavaScriptowi korzystanie z regionów CSS (CSS Regions) w przeglądarkach, które jeszcze ich nie obsługują.”
Przydałaby się na początku informacja co to w ogóle jest CSSRegions?
admin
02.18.2013
Dobra uwaga, chociaż myślę że lepszym rozwiązaniem byłoby opublikowanie osobnego artykułu na ten temat.
Nie ma trackbacków do wyświetlenia