Plugins

An overview of Jumpstart’s extended Javascript functionality.
Click here to see full documentation.

Countdowns

Count down to a specified date and time in the future.

Simple Example

Simple Example – Elapsed

Detailed Example

Days
Hours
Minutes
Seconds

This is the fallback for when the countdown is elapsed

Detailed Example – Elapsed

This is the fallback for when the countdown is elapsed

Counters

Animated counting up or down to a specified value.

Average Rating
Support
Downloads
Uptime
Average Rating
Downloads
Paid out this year
Active Accounts
Support Tickets Closed

Date Pickers

Turn a text input into a beautiful, flexible date picker.

    Single Date

    Date Range

    Date range with icon

    Icon For Door-open


    Google Maps

    Richly featured maps implementation. Easy to customize and style.

    Basic Example Using Address
    Info windows in Jumpstart

    Jumpstart Logo

    We’ve made info windows easy in Jumpstart, so you can use any HTML in this infowindow on your map.

    Address
    443 Park Avenue South, Kips Bay New York City

    … More Info

    Styled Map
    Info windows in Jumpstart

    Jumpstart Logo

    We’ve made info windows easy in Jumpstart, so you can use any HTML in this infowindow on your map.

    Address
    443 Park Avenue South, Kips Bay New York City

    … More Info

    [ { “featureType”: “administrative”, “elementType”: “labels.text.fill”, “stylers”: [ { “color”: “#444444” } ] }, { “featureType”: “landscape”, “elementType”: “all”, “stylers”: [ { “color”: “#f2f2f2” } ] }, { “featureType”: “poi”, “elementType”: “all”, “stylers”: [ { “visibility”: “off” } ] }, { “featureType”: “road”, “elementType”: “all”, “stylers”: [ { “saturation”: -100 }, { “lightness”: 45 } ] }, { “featureType”: “road.highway”, “elementType”: “all”, “stylers”: [ { “visibility”: “simplified” } ] }, { “featureType”: “road.arterial”, “elementType”: “labels.icon”, “stylers”: [ { “visibility”: “off” } ] }, { “featureType”: “transit”, “elementType”: “all”, “stylers”: [ { “visibility”: “off” } ] }, { “featureType”: “water”, “elementType”: “all”, “stylers”: [ { “color”: “#f88e88” }, { “visibility”: “on” } ] } ]

    Styled Map
    Info windows in Jumpstart

    Jumpstart Logo
    We’ve made info windows easy in Jumpstart, so you can use any HTML in this infowindow on your map.

    Address
    443 Park Avenue South, Kips Bay New York City

    … More Info

    Info windows in Jumpstart

    Jumpstart Logo
    We’ve made info windows easy in Jumpstart, so you can use any HTML in this infowindow on your map.

    Address
    443 Park Avenue South, Kips Bay New York City

    … More Info

    Info windows in Jumpstart

    Jumpstart Logo
    We’ve made info windows easy in Jumpstart, so you can use any HTML in this infowindow on your map.

    Address
    443 Park Avenue South, Kips Bay New York City

    … More Info
    [ { “featureType”: “all”, “elementType”: “geometry.fill”, “stylers”: [ { “weight”: “2.00” } ] }, { “featureType”: “all”, “elementType”: “geometry.stroke”, “stylers”: [ { “color”: “#9c9c9c” } ] }, { “featureType”: “all”, “elementType”: “labels.text”, “stylers”: [ { “visibility”: “on” } ] }, { “featureType”: “administrative.land_parcel”, “elementType”: “geometry.fill”, “stylers”: [ { “visibility”: “on” }, { “color”: “#372305” }, { “saturation”: “-25” } ] }, { “featureType”: “landscape”, “elementType”: “all”, “stylers”: [ { “color”: “#f2f2f2” } ] }, { “featureType”: “landscape”, “elementType”: “geometry.fill”, “stylers”: [ { “color”: “#ffffff” } ] }, { “featureType”: “landscape.man_made”, “elementType”: “geometry.fill”, “stylers”: [ { “color”: “#ffffff” } ] }, { “featureType”: “poi”, “elementType”: “all”, “stylers”: [ { “visibility”: “off” } ] }, { “featureType”: “road”, “elementType”: “all”, “stylers”: [ { “saturation”: -100 }, { “lightness”: 45 } ] }, { “featureType”: “road”, “elementType”: “geometry.fill”, “stylers”: [ { “color”: “#eeeeee” } ] }, { “featureType”: “road”, “elementType”: “labels.text.fill”, “stylers”: [ { “color”: “#7b7b7b” } ] }, { “featureType”: “road”, “elementType”: “labels.text.stroke”, “stylers”: [ { “color”: “#ffffff” } ] }, { “featureType”: “road.highway”, “elementType”: “all”, “stylers”: [ { “visibility”: “simplified” } ] }, { “featureType”: “road.arterial”, “elementType”: “labels.icon”, “stylers”: [ { “visibility”: “off” } ] }, { “featureType”: “transit”, “elementType”: “all”, “stylers”: [ { “visibility”: “off” } ] }, { “featureType”: “water”, “elementType”: “all”, “stylers”: [ { “color”: “#46bcec” }, { “visibility”: “on” } ] }, { “featureType”: “water”, “elementType”: “geometry.fill”, “stylers”: [ { “color”: “#c8d7d4” } ] }, { “featureType”: “water”, “elementType”: “labels.text.fill”, “stylers”: [ { “color”: “#070707” } ] }, { “featureType”: “water”, “elementType”: “labels.text.stroke”, “stylers”: [ { “color”: “#ffffff” } ] } ]

    Lightbox Gallery

    Group collections of images to be viewed in a scrollable lightbox. Powered by Fancyapps’ Fancybox plugin.

    Masonry Layout

    Lay out and filter a collection of elements in masonry style. Powered by Metafizzy’s Isotope plugin.

    Basic Masonry
    Filterable Masonry

    Icon For Thunder-move
    Icon For Thunder-move
    Icon For Thunder-move

    Modals

    Use Bootstrap’s JavaScript modal plugin to add dialogs to your site for lightboxes, user notifications, or completely custom content.


    Hello, im a basic modal!


    Sign In

    Enter your account details below 





    Subscribe Now

    Get great, spam-free content every month.







    We’ll never share your email address


    Readed-mail

    Check your inbox

    We have just sent further instructions for activating your account to name@company.io



    Subscribe Now

    Get great, spam-free content every month.







    We’ll never share your email address

    EU Flag

    Our site uses cookies to ensure the best browsing experience possible. See our Privacy Policy for more details.

    Parallax

    Animate elements with the scrolling of the page. Please note, the parallax stars are for demonstration purposes only.

    Parallax Background Image
    Parallax Elements

    Icon For Star
    Icon For Star
    Icon For Star
    Icon For Star
    Icon For Star
    Icon For Star

    Range Sliders

    Turn a text input into a highly customizable range slider. Please note these are created via HTML and are developers only

    Basic Slider

    Complex Pricing Slider

    3
    Users
    $
    120
    Total charge per month

    Range Slider



    Scroll Animations

    Animate items into view as they enter the viewport.

    Fade Up

    Urna imp volutpat lacus libero imp faucibus.

    Fade Right

    Urna imp volutpat lacus libero imp faucibus.

    Bounce Right

    Urna imp volutpat lacus libero imp faucibus.

    Fade Down

    Urna imp volutpat lacus libero imp faucibus.

    Bounce Left

    Urna imp volutpat lacus libero imp faucibus.

    Zoom In

    Urna imp volutpat lacus libero imp faucibus.

    Sliders

    Responsive sliders with touch-aware controls. Powered by Metafizzy’s Flickity plugin.



    Twitter Feeds

    Pull in a feed of tweets from any Twitter account. Powered by the Twitterfetcher plugin.

    Basic Twitter Cards

    Twitter icon

    Twitter Slider

    Typed Text

    A text effect to simulate typing keystrokes. Powered by Typed plugin.

    Typing With Cursor
    Fade Out

    Video Backgrounds

    Youtube, Vimeo and locally hosted fullscreen video backgrounds powered by the Jarallax plugin.

    Vimeo Video Background

    Vimeo Video Background

    Youtube Video Background

    YouTube Video Background

    Self-Hosted Video Background

    Self-Hosted Video Background

    Video Lightbox

    Link to a lightbox containing Youtube, Vimeo and locally hosted videos. Powered by Fancyapps’ Fancybox plugin.

    Vimeo Player in Lightbox

    [jumpstart_video_lightbox_button media_url=”https://vimeo.com/166034462#t=32s” button_class=”btn-dark”]

    YouTube Player in Lightbox

    [jumpstart_video_lightbox_button media_url=”https://www.youtube.com/embed/NM2wtte1JRE?start=1164″ button_class=”btn-dark”]

    Video Cover to Lightbox


    Play

    Video Players

    Youtube, Vimeo and locally hosted videos in a versatile, seamless interface. Powered by the Plyr plugin.

    Youtube / Vimeo Player
    Self-Hosted Player