jQuery SlideOutPanel
Slide From
$('#slide-out-panel').SlideOutPanel(); $('#slide-out-panel').SlideOutPanel({ slideFrom: 'left', }); $('#slide-out-panel').SlideOutPanel({ slideFrom: 'top', }); $('#slide-out-panel').SlideOutPanel({ slideFrom: 'bottom', });
Body Push
$('#slide-out-panel').SlideOutPanel({ bodyPush: true, }); $('#slide-out-panel').SlideOutPanel({ bodyPush: true, slideFrom: 'left', });
Escape Key Close
$('#slide-out-panel').SlideOutPanel({ enableEscapeKey: true, });
Screen Close
$('#slide-out-panel').SlideOutPanel({ screenClose: false, });
Show Screen
$('#slide-out-panel').SlideOutPanel({ showScreen: false, });
Transitions
$('#slide-out-panel').SlideOutPanel({ transitionDuration: '5s', });
$('#slide-out-panel').SlideOutPanel({ transition: 'cubic-bezier(.175, .885, .32, 1.275)', });
Width
$('#slide-out-panel').SlideOutPanel({ width: '50vw', });
Offset Top
$('#slide-out-panel').SlideOutPanel({ offsetTop: '50px', });
Events
$('#slide-out-panel').SlideOutPanel({ beforeOpen() { alert('Before Panel Opens'); }, afterOpen() { alert('After Panel Opens'); }, beforeClosed() { alert('Before Panel Closed'); }, afterClosed() { alert('After Panel Closed'); }, });
Methods