The Sale Card has two main sections - a <figure> with an image, alt text, caption and optional sales tag and an <article> with a heading, text and optional CTA style link tab.
These items sit side by side on wide screens and then the text area slides below the image when the device screen width is less than the break point setting.
The optional animations for the image, text and caption can occur only once or every time the item enters the viewport. By default, the animations does not occur on mobile phones but this can be turned on by checking a box.
The optional link can be configured to open internal or external pages and in a new window if required.
The card has controls for border radius and box shadow radius and color. The container and the wrapper have adjustable background opacity and there is a vertical spacing control to distance the card from the items above and below it.
Product Card
The product car adds a third layer. This is an info window that slides down when the info icon is clicked or tapped.
The window has a heading and a list for product features and/or specifications.
Animation
When using several of these items on a page, the same setting for "Animate Only Once " and "Animate On Mobile" must be the same.
N0TE
The animations used in EverWeb Widgets should not be confused with the animation built into the EverWeb application. They work in a different way, are much more efficient and should NOT be inserted on the same page as any items with the default animations.