EverWeb Widgets
Responsive Viewport Height Banner
Responsive Banner
The banner has responsive width and a fixed height. A separate height can be set for mobile phones. In this case, the banner is set to viewport height to fill the browser or device window no matter what size it is.
It loads a different size of image for each device type - computer, tablet and phone - to improve efficiency and download speed.
Overlay
The banner has a 100% overlay which can be adjusted for color and opacity. It has options for a logo at the top left and a horizontally and vertically centered heading and text.
Animation
The overlay, the heading and the text can animate in. Each item has controls to turn on the animation and to set the animation time and delay in seconds.
Scroll Or Fix
The image can scroll with the rest of the page content or, by checking a box to fix it and allow the overlay and the content below to scroll over it.
Navigation
The responsive navigation widget is inserted below the banner on the EverWeb design canvas and appears as an overlay at the top of the image on the published page. It can scroll with the rest of the content or be fixed in position to make it sticky and always remain in view.
The navigation is inline when viewed on computers and switches to a drop down opened and closed by tapping a "hamburger icon when viewed on mobile devices like the iPad and iPhone.
The links can be spaced out as show above or grouped together and have a colored separator. They can have transparency added using the opacity slider.
The mobile navigation is vertical and can have backgound transparency and a separator.
The navigation can accomodate up to fourteen links. The last two links can be configured to open internal or external pages and in a new window if required.
Active Link
There is an option to indicate the current page link with a different color. Selecting this option inserts a jQuery plugin to add an active link class to the existing navigation.
Responsive Scroll Bar
The full width scroll down bar is inserted below the navigation - and the navigation if present - on the EverWeb design canvas. It can appear below the image or, by checking a box, overlay it at the bottom.
The bar has options for a phone number which switches to a phone tab on mobile phones on the left. The email link is position at the right and has fields for email address and subject and can show a title on hover when viewed on computers.
The centered chevron down icon smooth scrolls down to the next section of the page when clicked or tapped.
Responsive Closable Bar
The bar can animate in from the top or bottom on page load and has a text field, close button and the option for up to three CTA style link tabs. The links can be configured to open internal pages and the last one has an external page option and can open in a new window.
There are no cookies used on this site, but if there were, this notice would be obligatory.