vue-stick-me-directive v1.0.2

vue-stick-me-directive

Stick block (may work dynamically)

<div v-sticky="true">
</div>

Reserve space for block in flow

<div v-sticky.keep="true">
</div>

Style wrapper and keeper on resize and orientation change

<div v-sticky.keep.resize="true">
</div>

Set unique class for sticky wrapper

<div v-sticky.keep="true" data-sticky-wrapper-class="stick-me-wrapper">
</div>

Change classes (global setting for all sticky blocks)

import { Sticky } from "vue-stick-me-directive";

Vue.directive("sticky", new Sticky({ containerClass: "my-container" }));

Defaults:

{
    containerClass: "sticky-blocks-container",
    containerId: "sticky-blocks-container",
    wrapperClass: "sticky-wrapper",
    stickyKeeperClass: "sticky-keeper"
}

TODO

• Develop setting (via data-attribute for example) to manage insert to specific index in containers
• Maybe change data-attributes to config object that passed as a value to directive