Custom Resize Event For Elements - jquery.resize.js

A Cross-browser resize element plugin that provides custom resize jQuery event with handling of default window resize.

The plugin provides performant resize detection using ResizeObserver on modern browsers (Chrome).

How to use it:

1. Download and place the JavaScript file jquery.resize.js after jQuery but beofre the closing body tag.

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" 
       integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" 
       crossorigin="anonymous">
</script>
<script src="jquery.resize.js"></script>

2. Detect the resize event on a specific element.

<div class="box">
</div>

$('.box').on('resize', function() {
  // do something
});

3. Use as a jQuery plugin.

<div class="box">
</div>

$('.box').resizer(function() {
  // do something
});

4. To remove the resize event handler.

$('.box').resizer('unbind', handler);

// or
$('.box').off('resize', handler);

---

This awesome jQuery plugin is developed by jcubic. For more Advanced Usages, please check the demo page or visit the official website.