How to hook into elgg's lightbox?

I want to hook into the elgg's lightbox options, so that I can pass some extra options before the lightbox getting triggered. I know we can pass some options through the 'data-colorbox-opts' attribute of URL, but that's not what I am looking for.

I want to run some jquery functions when the lightbox is loaded. I have done some basic research and found the following 

https://www.jacklmoore.com/colorbox/faq/#:~:text=JavaScript%2FjQuery%20is%20not%20working%20inside%20of%20Colorbox.,JavaScript%20into%20Colorbox's%20onComplete%20callback.

Any help will be appreciated as I am stuck on this for last few hours.

  • I have done some basic research and found the following 

    So, use it - just trigger your JS actions to lightbox. Why not?!

    There is

    'deps' => ['your_js'],

    parameter for link.

    Read this also.

  • Hi RVR,

    Those things I already tried. I dont want to duplicate a core code and modify it according to my needs. I am thinking about a solution where I can extend the core lightbox option parameters.

  • You don't need to duplicate or modify the lightbox code.

    Just use YOUR own JS as I've mentioned above.

    You can use the exists lightbox options too:

    var options = {
       // your code here
    };
    
    lightbox.bind('.elgg-lightbox', options, false);
     
    Or even simple JS:
     
    $(document).on('cbox_open', function() {
          // your code here
    }).on('cbox_closed', function() {
        // your code here
    });
Beginning Developers

Beginning Developers

This space is for newcomers, who wish to build a new plugin or to customize an existing one to their liking