xref: /template/strap/resources/snippet/js/onhover.js (revision e55e4e71208cf11ca8c608d736f6c1a20fb4c5c5)
1window.addEventListener("load", function () {
2
3    let inOutOnHover = function (event) {
4        const $element = jQuery(event.currentTarget);
5        let dataHoverClass = $element.attr("data-hover-class");
6        $element.toggleClass(dataHoverClass);
7    };
8
9    /**
10     * Bind hover class to a toogle element
11     * @param event
12     * https://api.jquery.com/hover/
13     */
14    jQuery("[data-hover-class]").hover(inOutOnHover,inOutOnHover);
15
16
17    /**
18     * Add binding when node are added
19     * @type {MutationObserver}
20     */
21    const observer = new MutationObserver(function (mutationList) {
22        // noinspection JSUnfilteredForInLoop
23        mutationList.forEach((mutation) => {
24
25            for (let index in mutation.addedNodes) {
26                let node = mutation.addedNodes[index];
27                if (node.nodeType === Node.ELEMENT_NODE) {
28                    if (node.dataset.hasOwnProperty("hoverClass")) {
29                        jQuery(node).hover(inOutOnHover,inOutOnHover);
30                    }
31                }
32
33            }
34
35        });
36    });
37    observer.observe(document, {childList: true, subtree: true});
38
39});
40
41
42
43
44