ThemeKit AUI

Flip On Click

ThemeKit AUI Flip Image
EverWeb Themes

Flip Image

The image is inserted in three sizes with alt text, an optional caption and has a lazy load option which should be used if the item isn't in view at page load.
Backface
The back is open for editing and then hidden before publishing.
Since EverWeb can't render CSS transorms the text will be inverted when viewed on the design canvas.
The backface has a heading, styled spans, text and an optional internal/external link.
Flip
The image can flip on th X or the Y-axis and can hover rotate when viewed on computers.

Images

Flipping

Using flip items reduces the amount of onload content which is a good idea for web pages that will be viewed on small mobile devices.
Although flip items have a fairly complex HTML layout they only require one line of Javascript with no dependency on jQuery which makes them very effecient and suitable for use on responsive web pages.
Icon & Cursor
The flip icon at the top right shows on hover on computers as does the cursor type set to "alias".
Perspective
When viewed on computers the image can rotate slidghtly on hover to show that it needs some action by the visitor. If some perspective is added this helps to create the illusion of depth.
Perspective values are usually expressed in pixels but using viewport units makes more sense for a responsive design.
The lower the value for perspective the greater the effect. A value of zero will remove it.

Flip Cards

ThemeKit AUI Flip Card 1
Responsive Widgets

EverWeb Widgets

$20

EverWeb widgets to build a fast efficient responsive website.

Info
ThemeKit AUI Flip Card 2
Graphic

Graphic

$20

Build a graphic designer website to stand out.

Discover More
ThemeKit AUI Flip Card 3
Galleries

Professional Class

Image & video galleries to take your website to the next level..

Update Now

Flip Cards

The EverWeb ThemeKit AUI Flip Card widget creates a row of two, three of four carrds with an image an caption and optional lazy loading.
On computers the cards show an alias cirsor and a flip icon on hover.and the icon when vieweed on mobile touch devices.
Flip Side
The back face has a heading, styled span for price/date etc and an optional link. The links can be configured globally to open internal or external pages.
Editing in EverWeb
Checking a box will display the backface for editing on the EverWeb design canvas and unchecking it will hit it prior to publishing.

© EverWeb Widgets -

Menu