Documentation
Options
The display and behavior of Polipop can be adjusted via the configuration options. The options are passed as an object when initializing a new instance.
var polipop = new Polipop('mypolipop', {
// Configuration options
layout: 'popups',
insert: 'before',
pool: 5,
sticky: true,
});
Reference
appendToblockpositionlayoutthemeiconsinsertspacingpoolstickylifeprogressbarpauseOnHoverheaderTextclosercloseTextloadMoreTexthideEmptyintervaleffecteasingeffectDuration
appendTo
A DOM element or selector string representing the element where the Polipop wrapper element will be appended to. Can only be set on class instantiation.
Default: 'body'
Type: String
block
The BEM block name which is used for generating css classes for all elements within the wrapper element. Can only be set on class instantiation.
Default: 'polipop'
Type: String
position
The position of the wrapper element within the viewport. Can only be set on class instantiation. Accepted values:
'top-left''center''top-right''inline''bottom-right''bottom-left'
Default: 'top-right'
Type: String
layout
The layout of the Polipop wrapper. Can only be set on class instantiation. Accepted values:
'popups''panel'
Default: 'popups'
Type: String
theme
The css theme of the Polipop wrapper. Can only be set on class instantiation. Accepted values:
'default''compact''minimal'- or any custom theme
Default: 'default'
Type: String
icons
A boolean designating whether each notification element displays an icon, according to the notification type.
Default: true
Type: Boolean
insert
Designates whether a notification element should be appended or prepended to the notifications container. Accepted values:
'after''before'
Default: 'after'
Type: String
spacing
The vertical spacing between the notification elements. Can only be set on class instantiation.
Default: 10
Type: Number
pool
Limits the number of concurrent notification elements that can be rendered within the notifications container at any given time. A value of '0' means that there is no limit.
Default: 0
Type: Number
sticky
A boolean designating whether the notification elements should be removed automatically when they expire or whether they should stay in the DOM until they are removed manually.
Default: false
Type: Boolean
life
Expiration time for non-sticky notification elements in milliseconds.
Default: 3000
Type: Number
progressbar
A boolean designating whether the life time progress bar will be displayed for each notification element.
Default: false
Type: Boolean
pauseOnHover
A boolean designating whether the notifications expiration control should pause when hovering over the wrapper element. Can only be set on class instantiation.
Default: true
Type: Boolean
headerText
The text that is displayed inside the 'panel' layout header. Can only be set on class instantiation.
Default: 'Messages'
Type: String
closer
A boolean designating whether the closer button element will be displayed when there are rendered notification elements. Can only be set on class instantiation.
Default: true
Type: Boolean
closeText
The text that is displayed inside the closer button element when the notifications queue is empty.
Default: 'Close'
Type: String
loadMoreText
The text that is displayed inside the closer button element when the notifications queue contains queued notification objects.
Default: 'Load more'
Type: String
hideEmpty
A boolean designating whether the 'panel' layout wrapper element will be hidden when there are no rendered notification elements.
Default: false
Type: Boolean
interval
The time, in milliseconds, the timer should delay in between executions of the _loop function. Can only be set on class instantiation.
Default: 250
Type: Number
effect
The animation effect when adding or removing notification elements. Accepted values:
'fade''slide'
Default: 'fade'
Type: String
easing
The rate of the animation's change over time. Accepted values:
'linear''ease''ease-in''ease-out''ease-in-out'- or a custom
'cubic-bezier'value
Default: 'linear'
Type: String
effectDuration
The number of milliseconds each iteration of the animation takes to complete.
Default: 250
Type: Number