<commit_before># hunt

[![Build Status](https://travis-ci.org/jeremenichelli/hunt.svg)](https://travis-ci.org/jeremenichelli/hunt)

Library to detect when DOM elements become visible and disappear on scroll


## Install

Download the libary and include it in a script tag or install as an npm package.

```sh
npm install huntjs --save
```

## Use

Once you've included the script tag or require the module you need to simply pass an element or a list of them and an object to configure the actions and behaviors.

```js
hunt(document.getElementsByClassName('element'), {
    in: function() {
        this.classList.add('visible');
    },
    out: function() {
        this.classList.remove('visible');
    }
});
```
You don't need to pass both <strong>in</strong> and <strong>out</strong>, you can pass one either of them or both, of course. You might have also noticed inside those methods you make reference to element that has become visible using the reserved word <code>this</code>, so you can make any modification to it.

By default <strong>hunt</strong> will stop "hunting" or watching for the element once the <strong>out</strong> method has been executed to improve performance, but if you need these methods to be called every time the element appears and disappears from the viewport you can pass a <code>persist</code> option as <code>true</code>, but beware you can affect scrolling performance.

```js
hunt(document.getElementsByClassName('element'), {
    in: function() {
        this.classList.add('visible');
    },
    out: function() {
        this.classList.remove('visible');
    },
    persist: true
});
```

In case you need actions to be executed under the hood, you can use the <code>offset</code> option.

```js
hunt(document.querySelector('.action--element'), {
    in: function() {
        this.classList.add('visible');
    },
    persist: false,
    offset: 150
});
```

## Size

This library weighs only <strong>635 bytes</strong> minified and gzipped!<commit_msg>Update file size in README<commit_after># hunt

[![Build Status](https://travis-ci.org/jeremenichelli/hunt.svg)](https://travis-ci.org/jeremenichelli/hunt)

Library to detect when DOM elements become visible and disappear on scroll


## Install

Download the libary and include it in a script tag or install as an npm package.

```sh
npm install huntjs --save
```

## Use

Once you've included the script tag or require the module you need to simply pass an element or a list of them and an object to configure the actions and behaviors.

```js
hunt(document.getElementsByClassName('element'), {
    in: function() {
        this.classList.add('visible');
    },
    out: function() {
        this.classList.remove('visible');
    }
});
```
You don't need to pass both <strong>in</strong> and <strong>out</strong>, you can pass one either of them or both, of course. You might have also noticed inside those methods you make reference to element that has become visible using the reserved word <code>this</code>, so you can make any modification to it.

By default <strong>hunt</strong> will stop "hunting" or watching for the element once the <strong>out</strong> method has been executed to improve performance, but if you need these methods to be called every time the element appears and disappears from the viewport you can pass a <code>persist</code> option as <code>true</code>, but beware you can affect scrolling performance.

```js
hunt(document.getElementsByClassName('element'), {
    in: function() {
        this.classList.add('visible');
    },
    out: function() {
        this.classList.remove('visible');
    },
    persist: true
});
```

In case you need actions to be executed under the hood, you can use the <code>offset</code> option.

```js
hunt(document.querySelector('.action--element'), {
    in: function() {
        this.classList.add('visible');
    },
    persist: false,
    offset: 150
});
```

## Size

This library weighs only <strong>639s bytes</strong> minified and gzipped!
{'fraction_non_alphanumeric': 0.11277445109780439, 'fraction_numerical': 0.0029940119760479044, 'mean_word_length': 3.931119311193112, 'pattern_counts': {'":': 0, '<': 39, '<?xml version=': 0, '>': 39, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2781676', 'n_tokens_mistral': 1133, 'n_tokens_neox': 1108, 'n_words': 461}