ESL Panel

ESLPanel is a custom element that is used as a wrapper for content that can be shown or hidden. Can use collapsing/expanding animation (smooth height change). Can be used in conjunction with ESLPanelGroup to control a group of ESLPopups

ESLPanel.register();

ESLPanel Attributes | Properties:

  • active-class - class(es) to be added for active state ('open' by default)
  • animate-class - class(es) to be added during animation ('animate' by default)
  • post-animate-class - class(es) to be added during animation after next render ('post-animate' by default)
  • initial-params - initial params for current ESLPanel instance
  • animating - a marker of animation process running

ESLPanel extends ESLToggleable you can find other supported options in its documentation.

Events

  • esl:before:show - thrown when panel is going to change its state to expanded
  • esl:before:hide - thrown when panel is going to change its state to collapsed
  • esl:show - thrown when panel change its state to expanded
  • esl:hide - thrown when panel change its state to collapsed
  • esl:after:show - thrown when panel changed its state to expanded
  • esl:after:hide - thrown when panel changed its state to collapsed