matchmedia

There are 1 repository under matchmedia topic.

• dom-examples

  mdn / dom-examples

  Code examples that accompany various MDN DOM and Web API documentation pages

  matchmediademodrag-dropdom-manipulationpointer-lockmdn-docstouch-eventspointer-eventschannel-messagingjavascript
  Language:JavaScript 3142

• Assortment / darkmodejs

  Utility package for managing Dark Mode on the web

  cssdarkmodejavascriptmatchmediamediaqueryprefers-color-scheme
  Language:JavaScript 398

• reegodev / vue-screen

  Reactive screen size and media query states for VueJS

  vuewindowscreenwidthheightmatchmediamediaqueryreactiveinnerwidthinnerheightvuejs
  Language:JavaScript 238

• sparkbox / mediaCheck

  Control JS with mediaqueries

  hacktoberfestmatchmediamediaqueries
  Language:JavaScript 238

• AnalogJ / matchmedia-ng

  matchmedia wrapper for angularjs

  angularjsjavascriptmatchmediaresponsive
  Language:JavaScript 137

• attila / savvior

  A Salvattore and Masonry alternative without CSS-driven configuration or absolute CSS positioning

  grid-layoutmasonrymatchmediamulticolumn
  Language:JavaScript 127

• trurl-master / jsdom-testing-mocks

  A set of tools for emulating browser behavior in jsdom environment

  testingreact-testing-libraryjsdommocksintersectionobserverresizeobserverviewportmatchmediajavascriptreactjswaapiweb-animations-apivitest
  Language:TypeScript 103

• CyberAP / vue-component-media-queries

  MatchMedia component library for Vue

  vuenuxtmatchmediamedia-queriesssr
  Language:TypeScript 74

• malte-wessel / react-matchmedia-connect

  Higher order components for matchMedia

  breakpointmatchmediareactjsresponsive
  Language:JavaScript 50

• dyakovk / jest-matchmedia-mock

  🃏 Mock for fully testing any media queries with Jest

  jestjest-mockmatchmediamedia-queriestypescript
  Language:TypeScript 43

• pearofducks / svelte-match-media

  a matchMedia plugin for svelte 3

  sveltesvelte-v3matchmedia
  Language:JavaScript 38

• Farfetch / react-context-responsive

  A package that provides a responsive context to your application, using React Context API.

  reactreactjscontext-apiresponsiveresponsive-layoutfarfetchmatchmediacssviewportmobilemediaqueriesmediaqueryhacktoberfest
  Language:JavaScript 26

• nash403 / fine-mq

  A fine API to manage media queries in JS with ease. It has first-class integration with VueJS.

  mqmedia-queriesmedia-querymatchmediarwdresponsivemobilemobile-firstnuxtnuxt-mqvue-plugin
  Language:TypeScript 22

• Ayc0 / mock-match-media

  Mock window.matchMedia for Node.JS environments (like tests or NextJS)

  jestlistenersmatchmediamocknextjsnodejstest
  Language:JavaScript 21

• magica11y / prefers-reduced-motion

  🎢 Detects user’s preferences for reduced motion using the 'prefers-reduce-motion' CSS3 level 5 media query.

  a11yaccessibilitycss-mediaquerymatchmediaprefers-reduced-motion
  Language:JavaScript 11
• react-match-breakpoints

  michalklim / react-match-breakpoints

  Lightweight, performant, and easy to use media query library for React 📱 💻 🖥️

  reactresponsivemedia-queriesmatchmedia
  Language:TypeScript 11
• vue-pointbreak

  akobrinsky / vue-pointbreak

  A simple plugin for Vue 3 that uses matchMedia for when css media queries won't give you enough.

  matchmediaresponsive-designtailwindvuevue3
  Language:TypeScript 8

• Merri / react-use-queries

  [Buggy on Firefox] React hook for media queries on window and any container element. NOTE: Container Queries seem to be coming to browsers in 2022!

  breakpointscontainer-queriescontainer-queryelement-querieselement-querymatchmediareactreact-hooks
  Language:JavaScript 8

• articulate / react-with-responsive

  📱↔️ 🖥️ Responsive Media Query Higher-Order Component (HOC) for React

  reacthigher-order-componentmatchmediaresponsivemedia-querymedia-queriesreact-component
  Language:JavaScript 7

• HomeServicesOfAmerica / respondable

  Utilizes matchMedia to performantly return conditional values based on media queries

  breakpointmatchmediaviewport
  Language:JavaScript 6

• nmanikiran / browser-apis

  There are a large number of Web / Browser APIs available. This repo contains the demos those APIs

  web-shareclipboarddialogfullscreenmatchmediatext-to-speechweb-speech-apinotificationsvibrationbatterynetwork-checkergeolocation-apibattery-statusdrag-and-dropintersection-observerpicture-in-picture
  Language:JavaScript 6

• Assortment / darkmodejs-demo

  Demo app for @assortment/darkmodejs

  cssdarkmodejavascriptmatchmediamediaqueryprefers-color-scheme
  Language:JavaScript 4

• jmaicaaan / system-media

  A React utility library to match your props to the given media query

  matchmediamedia-queryreactjstypescript
  Language:TypeScript 3

• magica11y / prefers-color-scheme

  🌗 Detects user’s color scheme preferences using the 'prefers-color-scheme' CSS3 level 5 media query.

  a11yaccessibilitycss-mediaquerymatchmediaprefers-color-schemeuser-preferencesweb
  Language:JavaScript 3

• kmaida / ng-mediacheck

  NPM package providing a service for working with mediaqueries in Angular

  angularmediaqueriesmatchmedianpmnpm-package
  Language:JavaScript 2

• lgraubner / mqr

  Functional matchMedia wrapper for media query handling.

  mediaquerymediaqueriesmatchmediaresponsivefunctionalstatebreakpoint
  Language:JavaScript 2

• ball6847 / angular-responsify.js

  Responsive utility for angularjs.

  angularjsmatchmediarxjsresponsiveangular-factory
  Language:JavaScript 1

• breeny / react-media-breakpoints

  Simple and configurable breakpoint matcher using matchMedia and render props

  reactreactjsresponsivebreakpointsjavascriptmatchmedia
  Language:JavaScript 1

• dkacha / jquery.matchMedia.js

  jQuery plugin for matchMedia

  jquerymatchmediajavascript
  Language:JavaScript 1

• iiroj / breakpoint-observer

  A React Component for rendering based on breakpoints.

  babelbreakpointmatchmediareactresponsivestorybooktypescriptviewport
  Language:TypeScript 1

• kundinos / mock-media-queries

  Simplifies testing of code that uses window.matchMedia

  mocktestingmatchmediamediaqueries
  Language:TypeScript 1

• magica11y / light-level

  🕯 Detects the ambient light-level of the user’s device using the 'light-level' CSS3 level 5 media query.

  a11yaccessibilitycss-mediaquerymatchmedialight-level
  Language:JavaScript 1

• magica11y / prefers-contrast

  🔆 Detects user’s preferences for contrast using the 'prefers-contrast' CSS3 level 5 media query.

  a11yaccessibilitycss-mediaquerymatchmediaprefers-contrast
  Language:JavaScript 1

• magica11y / prefers-reduced-transparency

  💎 Detects user’s transparency preferences using the 'prefers-reduced-transparency' CSS3 level 5 media query.

  a11yaccessibilitycss-mediaquerymatchmediaprefers-reduced-transparency
  Language:JavaScript 1

• pearofducks / vue-use-media

  A Vue 3 plugin for matchMedia

  vue3matchmediacomposition-api
  Language:JavaScript

• SebasttianDaza / miniWeb

  This website is the challenges with exercise to tthe JS

  cssjavascriptlocalstoragematchmedianodejs
  Language:JavaScript