Stacker Info

The widgets shown on this pages are …
Stacker Animation
The hero image has an overlay HTML5 <figure> element which is centered horizontally and vertically. This containery has a caption,an image with alt text and an optional link. The link can open internal and external pages and has a new window option.
Each item in the figure can animate in with controls for animation type, time and delay. The animation can be set to fire once or every time the item enters the viewport. It can also be set to fire on mobile phones if required but this is not normally desirable.
Note that the animations are NOT the same as the default EverWeb ones. They use a custom stylesheet which makes them more suitable for responsive pages that will be viewed on phones.
The animation types are …
In, Right, Up, Left, Down, Scale, Bounce, Rotate, Rotate Reverse, Spin, Spin Reverse, Swing Left, Swing Right, Swing Down, Swing Up
Stacker Video
The video player can be used for Vimeo or YouTube videos by inserting the video ID. This type of player gives a much better user experience than the defauly Vimeo and YouTube widgets.
The player is horizontally and vertically centered in the container.
The container can be have a solid color background or an image. The background image is inserted in two sizes for computer and mobile devices.
The widget has an option for inserting an HTML heading for the video title. This can be placed above or below the player and its position on the Y-axis adjusted.
The video player has options to insert a poster image to display on page load and to set the initial volume..
The player has a maximum width setting and has the option to add a border and/or a box shadow.
MP4 Video
The MP4 video player is similar to the Vimeo/YouTube one except that it has the option to insert the video file in two sizes. On page load SD file is set by default. It can be changed to HD using the settings button in the control bar.
Text & List
This widget has a grid layout with two columns. On wider browser/device widths they sit side by side and stack on screen widths below the break point.
Contact Bar
The contact bar has three optional links …
[1] A phone number which switches to a phone icon on mobile phones
[2] A link to the page with the contact form
[3] An email link with spam protection
The icons are SVGs so the color and hover color can be changes. The icontact bar can be inserted below a hero item and then moved up to overlay the bottom by checking a box.