Skip to content

Idea for auto height #192

Open
Open
@MordiSacks

Description

@MordiSacks

For anyone trying to achive auto height, I have manged with a simple directive

        app.directive('vuper-auto-height', (el, binding, vnode) => {
            let h = 0;

            el.querySelectorAll('.vueperslide > *').forEach(s => h = s.clientHeight > h ? s.clientHeight : h);

            h = h < el.clientHeight ? el.clientHeight : h;
            vnode.ctx.props.fixedHeight = h + 'px';

            if (!el.id) el.id = '_vps-' + vnode.ctx.uid;

            let style = document.head.querySelector(`style[id='_vps-${vnode.ctx.uid}']`);
            if (!style) {
                style = document.createElement('style');
                style.id = '_vpss-' + vnode.ctx.uid;
                document.head.appendChild(style);
            }
            style.innerHTML = `#${el.id} .vueperslide > * { height: ${h}px}`;
        });

usege

<VueperSlides v-vuper-auto-height>....

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions