Skip to content

jcbhmr/style-observer

ย 
ย 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

45 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

StyleObserver

Installation

Usage

<div id="flasher"></div>
<script type="module">
  setInterval(() => {
    if (Math.random() < 0.5) {
      flasher.style = "color: red"
    } else {
        flasher.style = "color: green"
    }
  }, 1000)
</script>

<div id="flashercopy"></div>
<script type="module">
  import { StyleObserver } from "style-observer"
  const so = new StyleObserver(() => {
    flashercopy.style = flasher.style
  })
  so.observe(flasher)
</script>
  • Attribute mutations
  • Subtree mutations
  • Supertree mutations
  • CSS animations
  • Media query changes
  • Stylesheet additions & removals
  • Adopted stylesheet additions & removals
  • Stylesheet mutations
  • Supertree resizings

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 84.4%
  • HTML 15.6%