Stacks Image 1057

Compare

A-B image comparison on the fly.
Instant Download
Requires Rapidweaver & Stacks Plugin v3.5 +

Compare is a fully responsive, interactive, A / B image comparison stack.

You can display pairs of images, of the before and after type, for example, before and after Photoshop retouching, or before and after a home remodelling project. Anything really. If you want to show differences between two images, this is a great interactive way to present that to your visitor.

The stack will accept images of any size or aspect ratio. The only prerequisite is that both images have been made equal size.

The stack is filly responsive, and works equally as well where ever you place it, at any screen size. It's nice and simple to use, with a well thought out user interface in Stacks edit mode, with just enough options to make the stack fit into your page design, offering the ability to colour the various elements of the presentation to your taste.

Demo

Live demos of the stack in action.

Stacks Image 1082
Slide to compare

Control

A comprehensive list of all available controls.

Stacks Image 1113
Before and after image drop zones

Just drag and drop your appropriate images into each of these drop zones. The only prerequisite is that both of the images are of the same size.

Initial position

You can choose the position the divider between each image is displayed when the page first loads. The is a percentage value from the left of the stack.

Thickness

This sets the thickness of the divider line between the two images.

Colour

This sets the colour of the divider line between the two images.

Size

This sets the size of the drag handle that prompts the user to drag the slider left and right.

Background

This sets the background colour of the drag handle that prompts the user to drag the slider left and right.

Arrows

This set the colour of the arrows that appear on the drag handle that prompts the user to drag the slider left and right.

FAQ

Installation and info.

Stacks Image 1191
Browser support

This stack is supported in all modern browsers. Any exception to this rule will be listed below.

Safari

Chrome

Firefox

Explorer

Known compatibility issues

There are no known compatibility issues with this stack.

Stack installation

Download.

After purchase, you will be sent an email containing a download link for the stack.
Download the zip file from the link, and unzip it to reveal the stack inside.
You should now see the stack as a logo style icon.

Normal installation.

Double click the un-zipped stack file (the one that looks like a piece of lego).
This will launch Rapidweaver if it was not already running, to automatically install the stack.
Rapidweaver handles the install process from here. Guiding you through a couple of simple clicks to complete the installation.
Re-start Rapidweaver to ensure the installation is complete.
You will now see the new stack in the Stacks plugin library.

Installation where more than one version of Rapidweaver is installed.

Sometimes if there is more than one version of Rapidweaver installed on your system, the double click method launches the wrong version of Rapidweaver to install the stack. To ensure the it is installed into the version you want to install to, you can, instead of double clicking the stack, just drag and drop it onto the appropriate Rapidweaver app icon in your dock at the bottom of your screen.

This will launch Rapidweaver if it was not already running, to automatically install the stack.
Rapidweaver handles the install process from here. Guiding you through a couple of simple clicks to complete the installation.
Re-start Rapidweaver to ensure the installation is complete.
You will now see the new stack in the Stacks plugin library.

© 2018 Doobox Software. Building premium Software Mac, C4D, & RapidWeaver™