Stacks Image 1230

Rinse

Create greyscale image hover effects from a single colour image.
Instant Download
Requires Rapidweaver & Stacks Plugin v3.5 +

Create greyscale image hover effects from a single colour image.

Cross browser support : When viewed in a webkit based browser the stack applies the effect using pure CSS. When viewed in any other browser (without support), the javascript kicks in and renders the effect.

New edit mode view : The stack has a great new development in edit mode. When dropping your images into the stack, you will instantly see a duplicate image with the effect applied, either normal or inverted. (see edit mode below).

Invert : You can choose to have the images display as greyscale on page load, and then revert to colour on hover. Or select Invert, to start out colour and switch to greyscale on hover.

Rinse intensity : You can choose how intense the desaturation effect is seen. You have options of Full desaturation, Strong, Medium, and Low.

Demo

Live demos of the stack in action.

Stacks Image 1255
Default demo.

With all the default settings applied, any image you drop into the stack will be displayed in 100% grayscale. And revert to 100% colour when hovered. Default transition speed is medium (300ms).

Stacks Image 1441
Stacks Image 1445
Inverted.

With the invert setting selected, your original colour image will be displayed, and will switch to greyscale only when hovered.

Stacks Image 1455
Stacks Image 1459
Transition speeds.

You can choose the speed of the transition hover effect. Available speeds below. (There is also an instant option).

FAST

Stacks Image 1472

MEDIUM

Stacks Image 1478

SLOW

Stacks Image 1484

SUPER SLOW

Stacks Image 1490
Rinse intensity.

You can choose how intense the desaturation effect is seen. You have options of Full desaturation, Strong, Medium, and Low.

FULL

Stacks Image 1502

STRONG

Stacks Image 1508

MEDIUM

Stacks Image 1514

LOW

Stacks Image 1520

Control

A comprehensive list of all available controls.

Stacks Image 1286
Has hover effect

Deselect to simply present your image in greyscale without any hover effect.

Rinse intensity

This is the amount of colour that will be rinsed from your image for the hover effect. (the desaturation amount).

Transition time

You can choose slow, medium or fast hover transition speeds.

Invert effect

Select to start out with a colour image and switch to greyscale on hover.

FAQ

Installation and info.

Stacks Image 1364
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.

Known compatibility issues

There are no known compatibility issue at this time.

Browser Support
Tested in all major browsers, on desktop and mobile devices, without issue.

Explorer

Safari

Chrome

Firefox

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