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)
Neither Here Nor There
- 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
jQuery plugins and prominent considerations:
- 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.
--used to create modals--is 72 KB
. It appears that no animations beyond a scale effect are built into the dialog component
, so the effect core
and fade effect
may be required for fading, bringing the minified JS total to 85 KB
. Can I use the original jQuery fade
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
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 (un
minified?) is 5 KB
The minified JS is 4 KB
Is there a clear winner among these plugins? Do you have any other recommendations?