Add intersection-observer to a Vue component or HTML element

Add intersection-observer to a Vue component or HTML element

Vue Intersect A Vue component to add intersection-observer to a Vue component or HTML element. The IntersectionObserver is an amazing API which allows you to observe one or more HTMLElement for when it has entered or left the viewport. This API has many u

Vue Intersect

A Vue component to add intersection-observer to a Vue component or HTML element.

npm version Coverage Status Build status

Table of content

Introduction

The IntersectionObserver is an amazing API which allows you to observe one or more HTMLElement for when it has entered or left the viewport.

This API has many use cases like, infinite-scroll, lazy-loading or animations when an element enters the viewport.

Demo

We've made a basic demo of how you might want to use vue-intersect. The code is available in the gh-pages branch and the part where vue-intersect is used can be found here.

Hackernews infinite scroll demo

Please keep in mind that the demo is not production code. Use it as an inspiration.

Installation

Simply install using your favorite package manager

Github Repository

Tags: #VueJs #Scroll