View the Live Preview to see what fig is capable of.

All styles and animations can be combined to create a unique experience for your image galleries.

Use the fig configurator to quickly generate fig HTML snippets ready to be copy and pasted to your website.

The package contains the original source files so if you’re a webdeveloper you can tweak the library to your own liking.

Plug & Play and no dependencies on other libraries.

Animations

  • 7 load animations. Animate a photo in to view in six different ways, pick from zooming in or out, fading, or rotating in various directions.
  • 8 hover animations. Bring a certain area of the photo in to focus on hover or move the photo around when the user interacts with it.
  • 9 caption animations. Slide, fade or push the caption into view from various directions.
  • 6 text animations. Animate the caption text into view via fading, sliding, stacking or apply the zebra animation.

Styles

  • 4 caption fill effects. 3 blur levels and a dreamy soft setting.
  • 2 caption colors. bright and dark.
  • 3 frame border widths.
  • 2 border colors. bright and dark.
  • 5 caption positions. Above, below, top, bottom or cover.
  • 3 font family setups.
  • 3 preset font sizes.

Configurator

Fig offers a lot of options, to make things manageable, it comes with a configuration tool so you can generate your own fig galleries with ease.

What do users think?

\\ \\ \\ \\ \\ axelcoon: Outstanding Support!

\\ \\ \\ \\ \\ Scardx15: Rik helped me every step of the way and made it possible for me to consider buying more items in the Envato market. Before I was skeptical and this was actually my first purchase but since I love the experience I’m going to continue buying. Thanks Rik!

\\ \\ \\ \\ \\ kryten68: Very easy to use and the effects are fantastic!

\\ \\ \\ \\ \\ va1957: Design Quality!

Support

If you have any questions before or after you purchased fig, please don’t hesitate to contact me, I am happy to assist.

Techniques

  • Responsive.
  • Touch friendly.
  • HTML5 or HTML4 setup.
  • Links can be put in or around the element, making the entire picture clickable.
  • Delayed image loading, images will load and animate when the scroll into view.
  • Sequence grouping and loading, group images together to animate their load animations in sequence.

File sizes

  • fig.css (30Kb, 3Kb gzipped)
  • fig.js (7Kb, 3Kb gzipped)

Browsers

  • Chrome
  • Safari
  • Firefox
  • Opera
  • iOS 6+
  • IE10
  • IE9 (no animations)
  • IE8 (no animations, not responsive, static captions)

Expected to work on Android 4.0+ as well but for now untested, if you have any doubts check the Live Preview to be sure before buying.

WordPress

Currently Fig has not been tested with WordPress. I see no reason why it should not work. For your convenience I’ve added some WordPress plugin references below.

You should be able to link the fig files using this plugin: CSS and JS links

The plugin below should allow you to add Fig HTML to your articles. Raw HTML

Photos

The photos used in the Live Preview are copyrighted under creative commons license Attribution 2.0 Generic.

History

v1.1.3

  • Fixed: iOS touch event would sometimes not work with caption cover setting

v1.1.2

  • Added: CSS uncompressed source file
  • Fixed: various small bugs as reported by users
  • Fixed: advanced layout rendering on IE8
  • Improved: performance

v1.1.1

  • Fixed: problems with image loading on ie8 and ie9

v1.1.0

  • Added: responsive, fig elements will scale depending on available screen real estate
  • Added: .fig-block which allows you to make a fig element fill the entire line it is on
  • Added: .fig-set which allows various scalable fig layouts (alpha to theta)
  • Added: .fig-link prevents underline on caption
  • Added: font and text style options
  • Added: push animation now automatically blocks the blur effect
  • Fixed: scale of fig items when in .fig-row or .fig-set
  • Fixed: block level links in gallery now don’t show underline
  • Notes: new functionality will not fully function on IE8

v1.0.4

  • Fixed: margins on images
  • Fixed: small tweaks to frame box shadow
  • Fixed: caption push no longer triggers on it’s own
by
by
by
by
by
by