V CSSju imamo na voljo različne t.i. “Media Queris”. Eden izmed teh je tudi “scripting”, ki je namenjeno zaznavanju podpore JavaScriptu.
Za razliko od prvih media querijev, ki so prihajali z veliko več pompa, ker so seveda omogočali odziven design (RWD), kar je popolnoma spremenilo logiko izdelave spletnih strani. Novi prihajajo precej bolj neopazno. Eden izmed teh je tudi “scripting CSS media feature”, ki je danes praktično povsod podrt, razen v IE brskalniku, ki je v ugašanju.
Ciljanje uporabnikov, ki nimajo podpore JavaScript-a ni novo. Običajno se to izvaja s pomočjo HTML elementa <noscript></noscript>. Kasneje smo imeli tudi s classom “no-js”, ki ga lahko še danes srečamo na spletu. Deloval je tako, da če JavaScript ni bil podprt je class ostal, drugače ga je odstranilo. Sedaj pa imamo to možnost tudi preko CSS-ja.
Media query scripting
Na voljo imamo tri stanja, in sicer:
- none (ni na voljo),
- initial-only (je na voljo na začetku – pred nalaganjem in nato ne. npr.: pred pripravljene strani) in
- enabled (na voljo prej in po nalaganju strani).
Primer kode:
See the Pen
CSS: Media query scripting by Ziga (@pomagalnik)
on CodePen.
V praksi nam bo ta media query prišel prav v primerih opozarjanja, kjer lahko določene vsebine/opozorila pokažemo oz. skrijemo. Drugi, pomembnejši primer pa je ob nadgradnjah za uporabnike, ki ne podpirajo JavaScripta. Tako nekateri uporabniki ne bodo več prikrajšani v primerjavi z drugimi.