I wasted hours trying to get the XXXXXXXX lightbox stack to work, and even the developer gave up replying to my emails. I found your TopBox stack by chance on the RapidWeaver forums, and was astounded at the ease of setup and functionality. Thank you for putting together such a brilliant lightbox stack that actually works!
Peter

There are dozens and dozens of different lightbox effects available, many of which can be used successfully with RapidWeaver. However some of these are difficult to setup and pull in a huge codebase - sometimes several hundred kilobytes of extra code and graphics. If you are building a website that makes heavy use of lightboxes (such as a video gallery or photography portfolio), using a mainstream lightbox effect like MediaBox Advanced would be a wise move, and help automate your workflow.

However on the other hand, if you are seeking to just setup a handful of basic lightboxes and you want complete control over the style and functionality, TopBox may be exactly what you've been looking for. Unlike other copy-and-paste solutions, TopBox was specifically designed and developed exclusively for RapidWeaver (meaning you will not find TopBox anywhere else). It takes into account the harsh, mixed-script environment RapidWeaver poses and promises a robust yet customisable lightbox solution. TopBox is ideal for quickly setting up some basic lightbox effects on a page, and works great with many different content types and web browsers. Here are some working examples of TopBox:

Examples

Setup

1. Drag and drop a TopBox stack into your page. Drag and drop some content into the trigger region and drop some content into the TopBox region. You can use almost any type of content you want.
2. In the TopBox settings, increment the TopBox ID number, if another TopBox is already using the same ID on that page. It is important every TopBox has a unique ID, to prevent multiple TopBoxes getting triggered at the same time.
3. Change the width and height dimensions, if required. Feel free to change any of the animation open and close settings. Likewise you can also customise the shade fill, TopBox fill, CSS border radius or internal padding.
4. Use any of the optional modules to inject extra functionality into your TopBox. For example, setup a close button, navigation buttons between TopBoxes, or an iFrame

From this point onwards, you will have a basic TopBox working in your page. TopBoxes can be triggered via two methods, either by clicking content in the optional trigger region, or by adding class="topbox#" to any element in the page (replacing hash '#' for the TopBox ID number).

Introducing TopBox Modules

TopBox modules provide a set of specific tools to enhance a TopBox and provide additional functionality beyond the basics. Modules are new in TopBox 2.0 and can be accessed from under the Stack settings, in the righthand panel. In some instances, modules like the Background module provide additional styling, whereas other modules like the button controls and iFrame module add extra functionality to TopBoxes, without a need for extra code. Here is some more information about each module available:

Background Module

The Background module provides you with 5 powerful background options for the TopBox window; solid colour, vertical gradient, horizontal gradient, local image, and warehoused image. Each background effect is applied as a CSS background on the TopBox window, so you can still display content (like text) in front of the background. This new background module opens up some fantastic possibilities for customising your TopBoxes and creating a real 'wow' factor. Solid colours and gradients look great for presenting text against. Options to use a background image (either from a picture on your computer or from a picture already stored online) enables you to showcase beautiful, engaging photographs and other graphics.

Close Button Module

Normally anyone can close a TopBox by clicking the window shade or hitting the escape key, on their keyboard. If you want to provide a conventional close button, use this Close Button Module. Start off by ticking the Display Close Button checkbox. Drag and drop a suitable icon or button image into the image well (note that TopBox installs some example buttons in the Stacks Media panel).
By default, the close button is displayed at the top right of the TopBox. You can change the horizontal and vertical position in the select menu's and also adjust the amount of margin that surrounds the close button. When clicked, the close button automatically fades-out that particular TopBox and the window shade.

Backwards Link Module

The backwards link module enables you to display an button, which acts as a link to the previous TopBox. This much-requested feature means that and end user is able to navigate backwards or forwards through a given set of TopBoxes.
To use this module, tick the checkbox to enable it. In the TopBox ID box, enter the ID of the TopBox you wish to link back to. Drag and drop a suitable image into the image well in the stack settings (TopBox installs some example buttons in the Stacks Media panel). The position and margin of this new image button you add can be changed using the provided settings. Now when the TopBox is open, a button gets displayed which will take a user back to the previous TopBox, when clicked.

Forwards Link Module

The forwards link module works in much the same way as the backwards link module, and enables you to display a button, which acts as a link to the news TopBox in a given set.
To use this module, tick the checkbox to enable it. In the TopBox ID box, enter the ID of the TopBox you wish to link forward to. Drag and drop a suitable image into the image well in the stack settings (TopBox installs some example buttons in the Stacks Media panel). The position and margin of this new image button you add can be changed using the provided settings. Now when the TopBox is open, a button gets displayed which will take a user forward to the next TopBox, when clicked.

iFrame Module

This is probably the most powerful module included with TopBox and has infinite uses. Primarily the iFrame module can be used to pull in pages from other websites, and safely embed these within your current page. It can also be used to embed video content and video's served by other content providers like YouTube and Vimeo. There are some good examples above.
Geek blurb: The iFrame code gets generated by the browser DOM using some clever jQuery code. This means that iFramed content is excluded from pre-loading, until the particular TopBox is triggered. Likewise the playback of any Flash video content or streaming is instantly terminated when the TopBox is closed.

iOS Support

Creating lightboxes which work on iOS devices like the iPhone, iPad and iPod is no easy task. Firstly these devices have small screen resolutions, compared with a normal computer. Secondly these devices lack certain CSS support, like position:fixed making the placement of lightboxes very difficult. Compared to other lightbox scripts, TopBox is about one of the most compatible lightbox plugins out there, for use with iOS devices. Users of these devices are able to click and open a TopBox, much the same as a person on a regular web browser can. A user is also able to double-tap and scale content within the TopBox, and pan around on content which extends outside of the viewport. About the only difference you will notice is that opening TopBoxes appear at the top of a page, and the page automatically jumps to the top when a TopBox is triggered. Remember that some content types like Flash are not supported on iOS devices, and you may see differences in the way other content types like YouTube and PDF's are handled.

Most experts still recommend that if you are serious about delivering optimised content for iOS devices, you use the Mobilize plugin by Nimblehost and a dedicated iOS RapidWeaver theme. There will be several brand new iOS RapidWeaver themes becoming available in early 2012.