Using an AJAX lightbox on pagebuilder pages

Options

We are using pagebuilder pages to display products in the Wildlife Adoption Center. An example of our pages is here:

https://secure.defenders.org/site/SPageServer?pagename=wildadopt_graywolf

As we prepare for this year's holiday season, we'd like to add the ability to see enlarged versions of the "product" items that come with each order (the plush, etc). We'd like to do this in a lightbox format where:

1. There's be a link which says "see enlarged images" that users would click on if they want to see an enlarged version of the image

2. On click, a lightbox would appear which contains both bigger image and add'l text to describe the item

3. The content that displays in the lightbox would "live" in the same page (not on a separate pagebuilder page)

4. The box would be scrollable

5. We'd be able to control the exact location of the box (either using fixed or relative location)

6. There'd be a "close " link in top right of box

I think that pretty much covers our needs. Some initial research tells me that Thickbox (http://jquery.com/demo/thickbox/) is the solution for us. But, before I dive into coding it, I'm wondering if any other convio clients are using this sort of solution on a pagebuilder page and/or if anyone knows if this is the best solution for what we're trying to achieve.

Thanks!

Tagged:

Comments

  • There are a ton of lightbox JS solutions out there... here's a good list of them

    http://www.fortysomething.ca/mt/etc/archives/005400.php

    Thickbox is probably fine, but I might be inclined to look at a prototype based library -- since our Convio pages already include that as a default.

    Granted most of the prototype lightboxes need you to also use the scriptaculous effects library, so the k savings might not really be worth much, but using multiple JS libraries on the same page has always seemed a bad idea in principle (even if perhaps not for any specific reason .

Categories