StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Here is a site that appears to have done it, but it is only version 0.5 and might change dramatically before 1.0: <br/> <a href="http://leandrovieira.com/projects/jquery/lightbox/#" rel="noreferrer">http://leandrovieira.com/projects/jquery/lightbox/#</a></p> <p>This should be what you're looking for, and here is a sample of their code to implement: </p> <pre><code>$(function() { $('#gallery a').lightBox({fixedNavigation:true}); }); </code></pre> <p>I hope this helps, </p> <h2>Thanks!</h2> <hr> <p>EDIT: </p> <p>Sorry that I didn't fully understand what you ment in version one of your question. Here is an updated answer (with code / source) to your question. </p> <p>First I created a control that will act as a modal dialog box that grays everything out in the background. Then I added the ability to put a picture in there, with added ability to have a comment with each picture. Here are images of the final product: </p> <p>First Image Loaded: <a href="http://img682.imageshack.us/img682/8941/firstpictureopen.jpg" rel="noreferrer">First Image Loaded http://img682.imageshack.us/img682/8941/firstpictureopen.jpg</a></p> <p>Second Image Fading In: <a href="http://img5.imageshack.us/img5/3172/secondpicturefading.jpg" rel="noreferrer">Second Image Fading In http://img5.imageshack.us/img5/3172/secondpicturefading.jpg</a></p> <p>Second Image Loaded: <a href="http://img682.imageshack.us/img682/5404/secondpictureopen.jpg" rel="noreferrer">Second Image Loaded http://img682.imageshack.us/img682/5404/secondpictureopen.jpg</a></p> <p>I also added animations to resize the images like the Lightbox project does. I added the ability to have a forward and back buttons, accelerator keys, forward and back arrow control, and escape to exit. I think I've captured what you're looking for in this control. </p> <p>As usual, I've uploaded the full source code to <a href="http://code.google.com/p/stackoverflow-answers-by-scott/" rel="noreferrer">Google Code</a> for your download. </p> <p>The direct link to the zip file is here:<br/> <a href="http://stackoverflow-answers-by-scott.googlecode.com/files/1755872.zip" rel="noreferrer">http://stackoverflow-answers-by-scott.googlecode.com/files/1755872.zip</a></p> <p>I hope this helps, </p> <h2>Thanks!</h2>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload