https://github.com/appleple/ui-expand

Just a simple UI helper to expand elements to full screen
https://github.com/appleple/ui-expand

Last synced: 4 months ago
JSON representation

Just a simple UI helper to expand elements to full screen

• Host: GitHub
• URL: https://github.com/appleple/ui-expand
• Owner: appleple
• Created: 2019-08-22T03:26:13.000Z (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2023-01-07T08:57:40.000Z (over 3 years ago)
• Last Synced: 2025-02-26T19:39:15.601Z (over 1 year ago)
• Language: HTML
• Homepage:
• Size: 2.24 MB
• Stars: 4
• Watchers: 6
• Forks: 0
• Open Issues: 26
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# ui-expand

![](./assets/example.gif)

## Install

```

$ npm install ui-expand --save

```

```js

import Expand from 'ui-expand'

```

### CDN

```html

```

## Usage

```html



  expand

    
Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam, delectus vitae voluptas, corrupti ea expedita velit veniam accusamus repellat ex non esse ipsa harum laudantium veritatis excepturi, sapiente qui. Excepturi.

  


```

```js

new Expand('.js-expand', {

  trigger: '.js-expand-btn' //it should be inside `.js-expand`

});

```

## Event

```js

new Expand('.js-expand', {

  trigger: '.js-expand-btn',

  beforeOpen: (element, trigger) => { //before expand

  },

  onOpen: (element, trigger) => { // after expand

  },

  beforeClose: (element, trigger) => { // before close

  },

  onClose: (element, trigger) => { // after close

  }

});

```