监听任意元素缩放事件

监听任意元素缩放事件

标签(空格分隔): JavaScript


通过给元素添加一个iframe,然后监听iframe的resize事件即可。

/**
 * 监听任意元素缩放事件
 * @param $ele
 * @param cb
 * @param isInitTrigger
 */
resizeEle: function ($ele, cb, isInitTrigger) {
    cb = typeof cb === 'function' ? cb : function () { };
    isInitTrigger = isInitTrigger !== false;

    var SELECTOR = 'resize-element-listener-iframe';
    $ele.css({ position: 'relative' });
    var $iframe = $ele.children('.'+ SELECTOR);
    if ($iframe.length) $iframe.remove();
    $iframe = $('<iframe class="' + SELECTOR + '" style="position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: -100;"></iframe>');
    $ele.append($iframe);

    var iframeWindow = $iframe[0].contentWindow;
    if (isInitTrigger) cb($ele, iframeWindow);
    $(iframeWindow).on('resize', function () {
        cb($ele, iframeWindow);
    });
}
posted @ 2019-02-28 10:34  古宝只  阅读(850)  评论(0编辑  收藏  举报