Have ideas to improve npm?Join in the discussion! »

    browser-has-hover
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.0 • Public • Published

    browser-has-hover

    Adds a has-hover class to the body if the user can hover with their device (i.e. not a touch device), which allows you to write conditional CSS to only apply hover pseudo selectors if the has-hover class exists, preventing the double click issue on touch devices. Also exposes a hasHover constant to be used in your JavaScript.

    Install

    You can install via npm or yarn.

    npm

    npm install --save browser-has-hover

    yarn

    yarn add browser-has-hover

    Usage

    You can import using ES6 imports. You can just import the library if you only want it to add the has-hover class to the body.

    import 'browser-has-hover';
    .button {
        // button styles
    }
     
    .has-hover .button:hover {
        // button styles for hover
    }

    If you need to know whether the browser has hover from your JavaScript you can import the constant like so:

    import { hasHover } 'browser-has-hover';
     
    if (hasHover) {
        // Do stuff for if the browser has hover
    }

    Install

    npm i browser-has-hover

    DownloadsWeekly Downloads

    4

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    46 kB

    Total Files

    5

    Last publish

    Collaborators

    • avatar