Not signed in (Sign In)

Vanilla 1.1.10 is a product of Lussumo. More Information: Documentation, Community Support.

Lightbox v2.0: link directly to an image from an external page (and make it 'pop-up')

Bottom of Page

1 to 3 of 3

  1.  
    • CommentAuthorJeroen
    • CommentTimeJul 16th 2007 edited
     
    I thought it would be nice to make it possible to link directly to an image from an external page, and make it 'pop-up' automatically.
    I did this using the url hash. This seemed a nice and correct way to do it.
    To obtain this I made a small change in the lightbox.js script at the bottom:

    function initLightbox() {
    myLightbox = new Lightbox();
    //Check if location.hash matches a lightbox-anchor. If so, trigger popup of image.
    if(document.location.hash && document.getElementById(document.location.hash.substr(1)).rel.indexOf('lightbox')!=-1) {
    myLightbox.start(document.getElementById(document.location.hash.substr(1)));
    }
    }
    Event.observe(window, 'load', initLightbox, false);

    The image in your page:
    <a rel="lightbox" id="Image001" href="foobar.jpg"><img /></a>

    Now you can make a link to it directly from another page:
    http://yourdomain/yourpage.html#Image001
    The image should popup automatically....
    •  
      CommentAuthorBrian
    • CommentTimeJul 29th 2007
     
    I liked this idea, but when I tried it, it made the image pop up twice... When I closed the first one, the second was still underneath...

    Thoughts of how to fix it so it works correctly? I know a lot of people would like this to work...
    •  
      CommentAuthorBramus!
    • CommentTimeJul 30th 2007 edited
     
    @ Brian : make sure the Event.observe(...); only appears once, cos' it seems like the initLightbox got called twice (here it works "just fine" btw) ;-)

    @ Jeroen : I took the liberty of modifying your implementation, so that it doesn't break when Lightbox needs to be updated (and users can't make little mistakes or "break" their Lightbox). See http://www.bram.us/2007/07/30/my-code-snippet-automatically-start-lightbox-on-page-load/ for details ;-)

1 to 3 of 3

  1.