Need help with gliojs?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

luisvinicius167
442 Stars 34 Forks 82 Commits 5 Opened issues

Description

Exit popup easely. Detects if the mouse of a user leaves the viewport borders of your website

Services available

!
?

Need anything else?

Contributors list

glio

Detects if the mouse of an user leaves the viewport / document borders of your website and when this happens, trigger your callback. Portuguese documentation.

Demo.

Chrome logo Firefox logo Internet Explorer logo Opera logo Safari logo
17+ ✔ 14+ ✔ 9+ ✔ 17+ ✔ 5+ ✔

Reasons for use:

  • Increase your conversion rates!
  • Give visitors reasons to stay!
  • Grab your users’ attention!

Cases:

  • if you are using gliojs, paste your project here.

Articles about Exit-popups:

Install:

  • Npm:
    npm install gliojs
  • Bower:
    bower install gliojs
  • Cdn:
    https://cdnjs.cloudflare.com/ajax/libs/gliojs/0.0.7/glio.min.js

Import the library glio.min.js in 'dist' folder in your site.



Usage:

The arguments are a Arrays, where the first index is the direction and the second is a callback.

javascript 
glio( [ direction, callback ] );

5 Directions:

  • top
  • top-left
  • top-right
  • bottom-left
  • bottom-right

Example:

  • top-left and top-right

    javascript
    glio.init(
      [ 'top-left', function () {
          alert('this is top-left');
        }
      ],
      [ 'top-right', function () {
          alert('this is top-right');
        }
      ]
    );
    
  • all directions

    javascript
    glio.init(
    [ 'top', function () {
        alert('this is top.');
      }
    ],
    [ 'top-left', function () {
        alert('this is top-left');
      }
    ],
    [ 'top-right', function () {
        alert('this is top-right');
      }
    ],
    [ 'bottom-left', function () {
        alert('this is bottom-left');
      }
    ],
    [ 'bottom-right', function () {
        alert('this is bottom-right'); 
      }
    ] 
    );
    

Configurations:

glio.config.key = value;
Set the configuration before the init. *
screenWidthFragment
: the quantity of parts the height and width screen will be divided. Default: 12. *
centerTopHeight
: height of 'top' direction. When the mouse is equal or major this value, the callback is triggered. Default: 10. *
heightTopLeft
: height of 'top-left' direction. When the mouse is equal or major this value, the callback is triggered. Default: 30. *
heightTopRight
: height of 'top-right' direction. When the mouse is equal or major this value, the callback is triggered. Default: 30.

This software is licensed under the MIT License.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.