yy-drawer

Class: Drawer

Drawer

new Drawer (options)

drawer.js:37
Name Type Description
options object optional
Name Type Default Description
parent HTMLElement document.body optional

where to attach the drawer
auto boolean true optional

automatically open and close the drawer based on acceleration or click
side string left optional

(left, right, top, or bottom)
size number optional

size (in pixels) of opened drawer
barSize number 20 optional

size (in pixels) of drag bar
full boolean true optional

whether the drawer should take up the full width or height
open boolean optional

start with drawer open
noInteraction boolean optional

open drawer only programmatically
styles object optional

styles for div
className string optional

class name for div
barBackground string rgba(0,0,0,0.25) optional

background setting for drag bar
ease string easeInOutSine optional

ease for animated opening
duration number 500 optional

animate time for opening drawer on click
threshold number 10 optional

number of pixels before move starts
timeRecent number 100 optional

maximum time in milliseconds to use when calculating acceleration
minVelocty number 0.5 optional

minimum velocity (pixels/millisecond) for opening and closing after a drag
content string optional

HTML content for the drawer
contentStyles object optional

styles for content of drawer
closeOnEscape boolean true optional

close the drawer when escape is pressed
Fires:
  • event:opening
  • event:closing
  • event:opened
  • event:closed
  • event:location

Members

Drawer.defaults object static

defaults for Drawer

auto boolean

automatically open and close the drawer based on acceleration or click

bar HTMLElement

Bar drawer element

bottom number

change bottom value of drawer

content HTMLElement

use this to add content to the div

div HTMLElement

Main drawer element

duration number

animate time for opening drawer on click

left number

change left value of drawer

location number

location of the drawer relative to the edge

minVelocity number

minimum velocity (pixels/millisecond) for opening and closing after a drag

change right value of drawer

threshold number

number of pixels before move starts after a mousedown or touchstart

timeRecent number

maximum time in milliseconds to use when calculating acceleration

top number

change top value of drawer

Methods

close (noAnimate)

drawer.js:607

close the drawer

Name Type Description
noAnimate boolean optional

open (noAnimate)

drawer.js:572

open the drawer

Name Type Description
noAnimate boolean optional

toggle (noAnimate)

drawer.js:556

toggle the drawer (close if open, and open if closed)

Name Type Description
noAnimate boolean optional

do not animate

updateContents (content)

drawer.js:139

call this to update the contents or after the contents of the drawer are updated (handles sizing)

Name Type Description
content string optional

Events

closed

drawer.js:699

trigger when drawer is fully closed because of UI interaction or drawer.close() finishing

Type:
  • object
Properties:
Name Type Description
drawer Drawer

closing

drawer.js:685

trigger when drawing is closing from UI click or calling drawer.close()

Type:
  • object
Properties:
Name Type Description
drawer Drawer

location

drawer.js:706

trigger when drawer's location changes because of UI interaction or drawer.close/open

Type:
  • object
Properties:
Name Type Description
location number

of drawer
drawer Drawer

opened

drawer.js:692

trigger when drawer is fully opened because of UI interaction or drawer.open() finishing

Type:
  • object
Properties:
Name Type Description
drawer Drawer

opening

drawer.js:678

trigger when the drawer is opening from UI click or calling drawer.open()

Type:
  • object
Properties:
Name Type Description
drawer Drawer