1. Home
  2. Knowledge Base
  3. Codex
  4. JS API
  5. JS Functions
  6. DiviArea.show()
DiviArea.show(id, event)

// Alias:
DiviPopup.show(id, event)

Open the Area with the given ID. When an animation is defined for the area, the animation will start to play.

Popup Areas:
When the popup is already open, it will be brought to the front.
This function also dims the background, by calling DiviArea.showOverlay().


(string|jQuery) Identifies the Area to display. The #-prefix is optional.
event … for Divi Areas Pro
(Event|jQuery) Required for Hover Areas. It specifies the element against which the Hover Area is positioned. Ignored for any other Area type.


The function returns true, if the area exists and was displayed. When the return value is false, a debug output describes the reason.


// The "#" prefix is optional. Following statements are identical:
// The <id> param can also be the jQuery element of the Area:
var demo = DiviArea.register('#sample');
// Display a Hover Area relative to an <a> tag (Divi Areas Pro only):
jQuery('a').on('mouseenter', function(event) {
    DiviArea.show('#hover-area', event);


This function was previously named DiviPopup.openPopup().

Was this article helpful?

Related Articles