A minimal, pure-CSS Lightbox replacement

Sylvia 9fc32b8b82 Remove example header		9 years ago
LICENSE	1702fddbbc Initial commit	9 years ago
README.md	9fc32b8b82 Remove example header	9 years ago
cssbox.css	cf99f9d185 Add background, make clickability clear, switch from border to shadow to avoid glitches	9 years ago

CSSBox

A simple, pure-CSS Lightbox replacement.

An example page is available in the gh-pages branch, or online on GitHub Pages.

Why CSSBox?

Actually lightweight (903b including comments, 607b excluding comments, unminified!)
Centers the image
Adds a nice, realistic shadow to the image
Dims the background
Completely responsive, works on any screen size
Has a pretty fade in animation
Absolutely no JavaScript

Upload cssbox.css to your server and add a stylesheet link to it in your CSS.

Add your images like this:

<img class="cssbox_thumb" tabindex=1 src="image_thumbnail.png" /><span class="cssbox_full"><img src="image_full.png" /></span>

When a visitor clicks the tumbnail, the fullsize preview will appear in the center of the screen.

Creative Commons Zero 1.0