vue-visible - v-visible directive for VueJS

  •        11

This plugins adds a v-visible directive (similar to the native v-show) that changes the visibility style of the applied element (hidden or visible).

https://github.com/javisperez/vue-visible

Tags
Implementation
License
Platform

   




Related Projects

vue-observe-visibility - Detect when an element is becoming visible or hidden on the page.

  •    Javascript

Detect when an element is becoming visible or hidden on the page. ⚠️ This plugin uses the Intersection Observer API that is not supported in every browser (currently supported in Edge, Firefox and Chrome). You need to include a polyfill to make it work on incompatible browsers.

vue-progressive-image - Vue progressive image loading plugin

  •    Javascript

To be able to immediately show some feedback to the user, it is possible to pass a placeholder image, which could be also 1% the size of the main image: it will be blurred so you can go crazy with optimizations here. The progressive-background has a "content" slot, which can hold content that needs to be rendered over the background image and also can hold a preloader. This slot has one property called "visible" that tells you when, for example, a preloader needs to be visible or not.

v-img

  •    Vue

v-img is a plugin for Vue.js that allows you to show images in full-screen gallery by adding only one directive to the <img> tag. *in this snippet all settings has its default value. No need to specify them unless you want to change default behavior. Unfortunately if you used CDN way to include plugin you can't set up these options, but still can set them up inline.

vue-virtual-scroller - ⚡️ Smooth scroll with any amount of data

  •    Vue

Smooth scroll with any amount of data (demo). ⚠️ vue-virtual-scroller now uses vue-observe-visibility to automatically refresh itself when shown to prevent display glitches. This means you need to include the Intersection Observer polyfill needed by vue-observe-visibility for this to work in old browsers (like Internet Explorer).

v-mask - 🔡 Tiny input mask library for Vue.js (directive)

  •    Javascript

This version requires Vue 2.X. If you are looking for Vue 1.X, check it here. Notice: v-model is required starting from v1.1.0, because a lot of bugs with HTMLElement event listeners and sync with Vue internals.


v-calendar - A lightweight, dependency-free plugin for building attributed calendars in Vue.js

  •    Vue

V-Calendar is a clean and lightweight plugin for displaying simple, attributed calendars in Vue.js. It uses attributes to decorate the calendar with various visual indicators including highlighted date regions, dots, bars, content styles and popovers for simple tooltips and even custom slot content. Any single attribute may contain one of each object and can be displayed for single dates, date ranges and even complex date patterns like every other Friday, the 15th of every month or the last Friday of every other month.

vue-shortkey - Vue-ShortKey - plugin for Vue.js

  •    Javascript

Vue-ShortKey - plugin for VueJS 2.x accepts shortcuts globaly and in a single listener. Add the shortkey directive to the elements that accept the shortcut. The shortkey must have explicitly which keys will be used.

vue-mugen-scroll - Infinite scroll component for Vue.js 2

  •    Javascript

むげん [mugen] means Infinity in English.The handler function to run after you scroll to the bottom of the list. It will also be invoked on component mounted and the mugen-scroll component is visible in viewport.

vue-scrollto - Adds a directive that listens for click events and scrolls to elements.

  •    Javascript

For vue 1.x use vue-scrollTo@1.0.1 (note the capital T) but keep in mind that the old version depends on jquery. vue-scrollto uses window.requestAnimationFrame to perform the animations, thus giving the best performance.

vue-chat-scroll - Automatic scroll-to-bottom directive for vue.

  •    Javascript

A plugin for Vue.js 2 that scrolls to the bottom of an element when new content is added within said element. Check out our lovely demo. Just include ./dist/vue-chat-scroll.js after Vue itself.

vue-animated-list - A Vue.js plugin for easily animating `v-for` rendered lists.

  •    Javascript

A Vue.js plugin for easily animating `v-for` rendered lists.

vue-clipboard2 - A simple vue2 binding to clipboard.js

  •    Javascript

Yes, you can do it by using our new method: this.$copyText. See sample2, where we replace the clipboard directives with a v-on directive. Modern browsers have some limitations like that you can't use window.open without a user interaction. So there's the same restriction on copying things! Test it before you use it. Make sure you are not using this method inside any async method.

v-viewer - Image viewer component for vue, supports rotation, scale, zoom and so on, based on viewer

  •    Javascript

To use v-viewer, simply import it and the css file, and call Vue.use() to install. Just add the directive v-viewer to any element, then all img elements in it will be handled by viewer.

focus-visible - Polyfill for `:focus-visible`

  •    Javascript

Based on the proposed CSS :focus-visible pseudo-selector, this prototype adds a focus-visible class to the focused element, in situations in which the :focus-visible pseudo-selector should match. We recommend only using versions of the polyfill that have been published to npm, rather than cloning the repo and using the source directly. This helps ensure the version you're using is stable and thoroughly tested.

vue-infinite-scroll - An infinite scroll directive for vue.js.

  •    Javascript

vue-infinite-scroll is an infinite scroll directive for vue.js.Use v-infinite-scroll to enable the infinite scroll, and use infinite-scroll-* attributes to define its options.

vue-sortable - A lightweight directive for reorderable drag-and-drop lists using RubaXa/Sortable

  •    Javascript

Easily add drag-and-drop sorting to your Vue.js applications without jQuery, using the v-sortable directive, a thin wrapper for the minimalist RubaXa/SortableJS library. Note that you will need to include RubaXa/Sortable & Vue before including vue-sortable.

bootstrap-tabcollapse - Bootstrap Tab Collapse plugin

  •    HTML

Small bootstrap plugin that switches bootstrap tabs component to collapse component for small screens.The most obvious way: bootstrap tab collapse generates accordion markup and appends it right away after tabs component. When accordion becomes (If accordion is) visible tabcollapse searchs for .tab-pane and detaches their content to appropriate accordion groups keeping all attached js data. Tabs component is given hidden-xs-class and accordion component is given visible-xs-class. That's it.