How to open DOM Element with Featherlight on Page Load?

I'm having trouble getting a Featherlight modal window to show content on page load.

Open Featherlight DOM with Link

<a href="#" class="my-content" data-featherlight="<p>My Content</p>">Open some DOM in lightbox</a>

This link loads html content from the data-featherlight attribute

Clicking the link will load "My Content".

On Page Load

$.featherlight($('.my-content'), {});

This only loads whats between the <a> tags, "Open some DOM in lightbox".

How to call "My Content" from the data-featherlight attribute on page load?

I need to have the html inside the data-featherlight, not outside in a div.

I thought it might be something like



Answers 1

  • Call .featherlight() on your content to ensure that the modal window is configured, and then use jQuery to .click() it right after the page loads:

    <script src=""></script>
    <script src=""></script>
    <a href="#" class="my-content" data-featherlight="<p>My Content</p>">
      Open some DOM in lightbox

Related Articles