# @victoryoalli/alpinejs-screen
> Trigger JavaScript when dimensions of an element's content is detected.
Latest version **1.0.0** (published 2021-08-22) · MIT license · 0 weekly downloads
## Install
```sh
npm install @victoryoalli/alpinejs-screen
pnpm add @victoryoalli/alpinejs-screen
yarn add @victoryoalli/alpinejs-screen
bun add @victoryoalli/alpinejs-screen
```
## Health
**Score 20/100 (F)** — status: abandoned.
Positive: esm support; no vulnerabilities.
Warnings: low downloads; no types.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 1.0.0 |
| Published | 2021-08-22 |
| First published | 2021-08-22 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 5.7 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Author | Victor Yoalli |
| Maintainers | victoryoalli |
## Links
- npm: https://www.npmjs.com/package/@victoryoalli/alpinejs-screen
- npm.io page: https://npm.io/package/@victoryoalli/alpinejs-screen
## Dependencies (1)
- [esbuild](https://npm.io/package/esbuild.md) ^0.12.22
## Recent versions
- 1.0.0 (latest) — 2021-08-22
## README
# Alpine.js plugin Screen
The **Screen Plugin** lets you programmatically monitor changes to the size of an element.
## Instalation
### Via script include
```html
```
### Via NPM
```javascript
import Alpine from 'alpinejs'
import screen from '@victoryoalli/alpinejs-screen'
Alpine.plugin(screen)
window.Alpine = Alpine
window.Alpine.start()
```
# x-screen
Directive
```html
```
# $width and $height
Magic helpers
```html
Bigger than 1024 pixels
```
### Example
Using $width magic helper
```html
MOBILE
```
---
_Source: https://npm.io/package/@victoryoalli/alpinejs-screen · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._