At the very least, I want to view images without using a new tab or window and without needing browser buttons or links to return to the thumbnail area. At the most, I want to view entire thumbnail galleries and accompanying text in a modal window. For the latter, the jury is still out; I'll need to see how it fits in my website's flow.
- jQuery compatibility
- Background overlay
- Fade-in/fade-out of the modal window and background overlay upon activation/close with fading speed options
- Next/previous navigation indicators within the image that appear/disappear instantly on hover over the corresponding right/left half of the image
- Close button
- Modal window closes when users click outside it
- Modal window closes when the ESC key is pressed
- CSS styling, especially of modal window borders, overlay, navigational indicators, close button and loading indicators (what appears where the image will load while it is loading)
- Less code and bandwidth is better
- Less processing overhead and computational time is better
- Priority given the latter; will sacrifice a larger data requirement for quicker responsiveness
- Less hacking and coding is better; I am neither a professional nor experienced coder
- For display while the image is loading, I'm going to create a black background with centered, white text that says "loading." I find this much less obtrusive than the animated, circular indicators that I associate with slow computing.
jQuery plugins and prominent considerations:
The JS is 47 KB. The JS ".pack" (I'm not familiar with this extension) is 23 KB. Adding what they call "helpers"--additional JS for buttons, media and thumbnails--will add 3, 6 and 4 KB, respectively, as well as three separate JS files.
The minified JS is 11 KB.
The minified JS is 10 KB.
The JS (unminified?) is 5 KB.
The minified JS is 4 KB.
Is there a clear winner among these plugins? Do you have any other recommendations?