• Stars
    star
    130
  • Rank 277,575 (Top 6 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created almost 13 years ago
  • Updated over 5 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

๐Ÿ‘€ Watches elements for changes in properties and attributes

Watch.js

This plugin lets you listen for when a CSS property, or properties, changes on element. It utilizes Mutation Observers to mimic the DOMAttrModified (Mutation Events API) and propertychange (Internet Explorer) events.

There is both a jQuery-specific plugin as well as a library agnostic version of this plugin available.

Bower Usage

bower install darcyclarke/watch.js --save

Default Usage

// Watch for width or height changes and log values
let $div = document.querySelectorAll('div')
watch($div, 'width height', function() {
  console.log(this.style.width, this.style.height)
})

jQuery Usage

// Watch for width or height changes and log values
$('div').watch('width height', function() {
  console.log(this.style.width, this.style.height)
})

Dependancies

This library utilizes the Polymer team's Mutation Observers and WeakMap Polyfills. They are included by default which bulks the library a bit. Depending on future usage, I may choose to references these as bower dependancies.

More Repositories

1

Repo.js

๐Ÿ“„ A plugin to embed Github repos on your site
912
star
2

Detect.js

๐Ÿ” Library to detect browser, os and device based on the UserAgent String
JavaScript
643
star
3

rawkit

๐ŸฆŠ Immediately Open Chrome DevTools when debugging Node.js apps
JavaScript
320
star
4

jQuery-Fullscreen-Plugin

A full suite fullscreen plugin with fallback support
JavaScript
25
star
5

WordPress-Deploy-Sync

๐Ÿšš A WordPress Deployment/Syncing workflow that doesn't kill braincells
JavaScript
17
star
6

octofiles

โฌ†๏ธ Browser Extension to easily upload files to the cloud using GitHub
JavaScript
15
star
7

sleepover

๐Ÿ’ค Sleep, snooze & step methods
JavaScript
14
star
8

jQuery-TypeOut-Plugin

A plugin to sequentially type out an elements text like a ghost . Similar to old news tickers.
JavaScript
9
star
9

is-ship-stuck

Is the ship stuck still?
JavaScript
8
star
10

jQuery-Animate-Auto-Plugin

๐Ÿš A lightweight jQuery plugin that allows you to animate "auto" values
JavaScript
8
star
11

github-activity-extension

:octocat: Toggle display of noisy activity notifications in issue & PR threads
JavaScript
8
star
12

pet-a-day-action

Change your GitHub/Gravatar photo to a different cute animal each day...
JavaScript
7
star
13

javascripting-golf

โ›ณ๏ธ Solving NodeSchool's "javascripting" workshopper with the least amount of code
JavaScript
6
star
14

thoughts

๐Ÿ’ญ Thoughts on development, design, news etc..
5
star
15

minargs

minimal argument parsing - bring your own validationโ„ข๏ธ
JavaScript
5
star
16

jQuery-Sort-Grid-Plugin

A lightweight jQuery plugin that lets you animate/sort elements
JavaScript
5
star
17

Refined-Azure

๐Ÿ—ป A clean theme for the Azure Portal (web extension)
CSS
5
star
18

Space-Apps

๐ŸŒŽ Team TWG's Space Apps Project
Objective-C
4
star
19

torontojs-workshop

๐Ÿšœ Fun with canvas
JavaScript
4
star
20

iso-theme

๐Ÿš€ An Isomorphic JavaScript WordPress Theme utilizing Node.js and Express on a LAMP stack
HTML
4
star
21

faq

Frequently Asked Questions
3
star
22

jQuery-Flickr-Video-Plugin

A plugin to generate a flickr video from a url
JavaScript
3
star
23

darcy

๐Ÿ‘ค all my info, centralized in one place
JavaScript
3
star
24

jQuery-Flickr-Photo-Plugin

A plugin to generate a flickr photo froma url
JavaScript
3
star
25

minargs-cli

cli for the minimum viable argument parser
JavaScript
2
star
26

gh-testing

JavaScript
2
star
27

solving-monty-hall

Some code to show probablities for the "Monty Hall Problem"
JavaScript
2
star
28

jQuery-Flickr-Gallery-Plugin

A plugin to generate a flickr gallery from a set url
JavaScript
2
star
29

W3C-Mailing-List-Extension

๐Ÿ“ซ A Chrome Extension to Update the look and feel of the W3C Mailing List Archives
JavaScript
2
star
30

npm-offline-cache

๐Ÿ“ฆ An example of how to set up npm to point to a local project's cached/mirrored deps
JavaScript
2
star
31

darcyclarke

:octocat: Global stuffs
2
star
32

semver-typescript

2
star
33

jamming-with-npm

A static site... to showcase npm hooks + netfliy
HTML
1
star
34

react-insta-feed

Instagram Feed in React
JavaScript
1
star
35

npm-optional-peer-deps

1
star
36

NodeSchool-CLI

NodeSchool CLI - As defined in: https://github.com/nodeschool/toronto/issues/68
1
star
37

Boilerplate

My project boilerplate
CSS
1
star
38

github-improved-textarea

Simple set of improvements for the GitHub textarea inputs
1
star
39

npm-update-latest-windows-repro

1
star
40

dotfiles

1
star
41

npm-workspaces-ci

Example CI setup for npm workspace project
1
star
42

Set-Rectangle-Sketch-Plugin

๐Ÿ”ณ A Sketch Plugin for setting default dimensions on creation of rectangle
JavaScript
1
star