screen-env

Differentiate screen types by size, touch ability, and more.

[ This description is mirrored from README.md at github.com/jifalops/screen-env on 2019-05-10 ]

screen-env

Differentiate screen types by size, touch ability, and more.

Installation

bower install --save screen-env

Usage

• Bind to the screen-env properties you are interested in.

Demo

<screen-env
  narrow-width="{{narrowWidth}}"
  is-touch="{{isTouch}}"
  ua-is-desktop="{{uaIsDesktop}}"
  is-mobile="{{isMobile}}">
</screen-env>
<table border="1">
  <tr><th colspan="3">Main abilities</th></tr>
  <tr><td>narrowWidth</td><th>[[narrowWidth]]</th>
      <td>Mobile/tablet+, (600px or less)</td></tr>
  <tr><td>isTouch</td><th>[[isTouch]]</th>
      <td>false: no browser support<br/>
          null: browser support<br/>
          true: touchstart has occurred</td></tr>
  <tr><td>uaIsDesktop</td><th>[[uaIsDesktop]]</th>
      <td>User requested desktop site</td></tr>
  <tr><td>isMobile</td><th>[[isMobile]]</th>
      <td>Material design + UA/media check</td></tr>
  </table>

Full demo: webcomponents.org | github.

API: webcomponents.org | github.

Contributing

1. Fork it on Github.
2. Create your feature branch: git checkout -b my-new-feature
3. Commit your changes: git commit -am 'Add some feature'
4. Push to the branch: git push origin my-new-feature
5. Submit a pull request

License

MIT

Links

• GitHub Homepage
• View on GitHub
• License
• Issue tracker

Compatibility