ember install ember-frost-popover
Interface | Attributes | Value | Description |
---|---|---|---|
Action | close |
Close the popover and optionally fire an external action | |
Option | offset |
The amount in pixels the popover should appear from the target (defaults to 10 ) |
|
Option | position |
top ,right ,bottom ,left , auto |
The location of the popover relative to the target. When auto is specified, it will dynamically reorient the popover. For example, if position is auto left , the popover will display to the left when possible, otherwise it will display right. (defaults to bottom ) |
Option | closest |
boolean | When true uses JQuery's closest function. Otherwise just uses main selector $(<target>) (defaults to false ). |
Option | excludePadding |
boolean | When true removes the padding from position calculations (defaults to false ). |
Option | event |
The event that will trigger the popover (defaults to on click ). Uses on() |
|
Option | target |
The selector string of the target that activates the popover | |
Option | viewport |
The selector for the viewport. Defaults to 'body' | |
Option | resize |
If set to false, will prevent the browser from resizing at the edges of the viewport. This preserves the expand to fit content behavior of width: auto . It defaults to true. |
If the frost-popover
component is placed next to the target
, be careful to use a selector that will uniquely
identify the target
. If it is nested inside the target
, you can set closest
to true which will search the
nearest ancestor from the popover
.
The popover
is displayed using absolute
positioning. The target
's coordinates are determined from the offsets
from its parent's container. In most cases, the target
will occupy the same stacking context as the popover
.
However, if the target
has absolute
positioning and the popover
is nested, they won't share the same stacking
context and the popover
's position will be erroneous. If the target
must be absolute
, then it's best to place
the popover
next to it.
template.hbs
git clone git@github.com:ciena-frost/ember-frost-popover.git
cd ember-frost-popover
npm install && bower install
A dummy application for development is available under ember-frost-popover/tests/dummy
.
To run the server run ember server
(or npm start
) from the root of the repository and
visit the app at http://localhost:4200.
Run npm test
from the root of the project to run linting checks as well as execute the test suite
and output code coverage.