Dom changed event.

Updated docs.
This commit is contained in:
nobuti 2017-01-18 20:14:23 +01:00
parent 5f0a423128
commit 4707acc287
2 changed files with 29 additions and 15 deletions

View File

@ -332,6 +332,10 @@ The number of pixels the content width can surpass the container width without e
The number of pixels the content height can surpass the container height without enabling the Y axis scroll bar. Allows some "wiggle room" or "offset break", so that Y axis scroll bar is not enabled just because of a few pixels.
**Default**: `0`
### autoupdate
When set to true, the scroll will be updated when an element is added or removed from the content.
**Default**: `true`
### theme
A string. It's a class name added to the container element. The class name is prepended with `ps-theme-`. So default theme class name is `ps-theme-default`. In order to create custom themes with scss use `ps-container($theme)` mixin, where `$theme` is a scss map.
**Default**: `'default'`
@ -396,6 +400,9 @@ This event fires when scrolling reaches the start of the x-axis.
### ps-x-reach-end
This event fires when scrolling reaches the end of the x-axis.
### ps-dom-change
This event fires when dom elements have been added to or removed from the content.
You can listen to these events either with vanilla JavaScript
```javascript
document.addEventListener('ps-scroll-x', function () {

View File

@ -4,6 +4,12 @@ var update = require('./update');
var MutationObserver = window.MutationObserver;
var instances = require('./instances');
var createDOMEvent = function (name) {
var event = document.createEvent('Event');
event.initEvent(name, true, true);
return event;
};
module.exports = function (element) {
if (MutationObserver === null || MutationObserver === undefined) {
// MutationObserver is not supported
@ -13,6 +19,7 @@ module.exports = function (element) {
var i = instances.get(element);
var onMutationObserver = function () {
update(element);
element.dispatchEvent(createDOMEvent('ps-dom-change'));
};
i.observer = new MutationObserver(onMutationObserver);