Special Hunters Promo: 2 video sequences, edited just for you!

beautiful, free people videos for your homepage

7 new videos every monday
Loading Coverr...

Coverr was made with by the CodersClan and Veed.Me teams

People Coverrs


Top

Fire<->Ice

TwisterTime

Summer Place Flyby

Playful Sunday

Broadwaycrew

Cardio Time

Oculus

Trio

Fancy Fence

Vacay Mode

Ultra Sunset

Cinema Paradiso

Workout

Thirst

Practice day

Carmel California

Dog-And-Fog

Airport Check-In

Workit

walking on stripes

Steptwo

Streetclown

Two Guys Walking

Green Machine

Strole in the Park

Gardening

Rainy Street

C Town

Short Matkot

West Braodway

Golfing

Amalfi

Honeymoon

Tilted Beach

Two-Swimmers

Burrito Time

Tourists

Squirrel and Co

Work-Walk

Yellow Traffic

1-0

Chinatown Trio

Flowers Girl

The Goalkeeper

Tulips are Here

Muji Doodle

Save As

Sharper

Sketch

Dirt Bike

Turn Left

Camping Breakfast

Keep Running

Apres Ski

The Slope

Winter Rest

Office Perks

Black Keys

Concrete Jungle

The Cucumber

Shoelaces

Circles and people

Discussing features

After Party

Orchestra

Shoes Stories

The Alley

Healthy Life

Park Stroll

Morning Routine

Snowball

Very Open Space

Drink Sake

Fire Snow

Big Apple

Sunset Siesta

Tulum

Beach Bar

Lonely Blue

Bulldozer

Cotton Sky

Office Day

Underground Traffic

Blue Horizon

Browsing

Fresh Paint

Spacious

Diagonal

Everest

HorGumpns

Ground Zero

High Lines

Park Traffic

Screens Only

Walk the Dog

Walking Heads

Yellow Cars

Mafrum

The Shore

Bumper Cars

Carousselle

Escalators

Pad Thai

Scooooters

Vacation Mode

Dishes

Traffic Jungle

Here Boy

Pink Swan

Working Man

Beach Mode

Busy People

Cable Skiing

Indoor Market

Matkot

Paperwork

Walking By

IKEA

Inbox Zero

Team Work

To The Left

Boat Lapse

Last Call

Man and Sea

Park Lapse

Busy

Comics

Free Parking

Go With The Flow

Hold

Home and Away

Rectangle Movements

Running Sushi

Shibuya

Shoes

Shrine

The Crosswalk

Down

In And Out

Mystic Beach

Urban Bokeh

Urban Jungle

Glass Maker

No Worries

Round Table

Swimmer

Border Collie

Erase and Rewind

Noted

Wave Sitting

Analog Typing

BW Scroll

Email Scroll

Hey World

Love iOS

Procrastination

White Keyboard

Authentic Shower

Bird Catcher

Indian Pedestrian

Next Stop

Blurry People

'Merica

Screens

Working House

Yes No

abcd

Cruise Control

Depth of Field

River Side

The DJ

The Tourist

Ups and Downs

Acro

Blue Bottle

Cello Guy

Good Mood

Pigeon Impossible

2 Ways Traffic

A Purple Balloon

PC Typing

Plug and Play

Major Tom

Pour

Skate

Under

Wall Sketching

Cycling Santa

Happy Street

Moving Forward

Slow Dog

Thin Ice

Boat Alone

Runner

Slash

White Board

Cheer Up

Hoola

Horizontal

Typer

Undo

Country Girl

Drums

Earlybird

Fire Ceremony

Mathura Bazaar

On The Ganges

Night BBQ

Type

Traffic Tree

Coder

Fruity

Meeting Room

Push the Buttons

Cut n Paste

Diverrs

Hitch Hiking

Big City Life

Crossroad

Gaiserr

Going Places

Relaxation

Broadway

Curiosity

Draw Something

Egg Shop

Market

Street View

Brooklyn

Coffee Shot

Falling Leaf

Hanging Out

Karate Kids

Beach Please

Home Work

Innocence

Mowing The Lawn

Working It

A Working Man

Boarding

Go Fish

Three Cocktails

Yoga Time

A Director View

Beach Ball

Escalation

I Love You

Mock Up

Girls Code

Home

NYC Traffic

50 Percent Off

City Walking

Productive Morning

Clothing

We Work We Wait

Android Scroll

Beach Camera

iPhone Scroll

Surfers Paradise

The Dock

Veggie Stand

Working Space

Sugar

The Hose

The Poyke

Carmela

City Nights

Comfy

Point of View

Slide Show

Typing Numbers

Tomato Tomato

Into The Woods

Mickey

Strum Away

For_Wes

Hosin

Agile

All Set

Scratch That

Dolores

Puzzling

The Boulevard

Blurred Traffic

Typing...

Yoga

Flea Market

Market People

Pedestrian

The Fishermen

Rusty Beach

Office Hours

How to use

1. Download your favorite video.

2. Upload the video to your website.

3. Add the following snippets to your site

Be sure to change the 3 source paths marked in blue

<div class="homepage-hero-module">
    <div class="video-container">
        <div class="filter"></div>
        <video autoplay loop class="fillWidth">
            <source src="PATH_TO_MP4" type="video/mp4" />Your browser does not support the video tag. I suggest you upgrade your browser.
            <source src="PATH_TO_WEBM" type="video/webm" />Your browser does not support the video tag. I suggest you upgrade your browser.
        </video>
        <div class="poster hidden">
            <img src="PATH_TO_JPEG" alt="">
        </div>
    </div>
</div>
.homepage-hero-module {
    border-right: none;
    border-left: none;
    position: relative;
}
.no-video .video-container video,
.touch .video-container video {
    display: none;
}
.no-video .video-container .poster,
.touch .video-container .poster {
    display: block !important;
}
.video-container {
    position: relative;
    bottom: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
    overflow: hidden;
    background: #000;
}
.video-container .poster img {
    width: 100%;
    bottom: 0;
    position: absolute;
}
.video-container .filter {
    z-index: 100;
    position: absolute;
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
}
.video-container video {
    position: absolute;
    z-index: 0;
    bottom: 0;
}
.video-container video.fillWidth {
    width: 100%;
}
//jQuery is required to run this code
$( document ).ready(function() {

    scaleVideoContainer();

    initBannerVideoSize('.video-container .poster img');
    initBannerVideoSize('.video-container .filter');
    initBannerVideoSize('.video-container video');

    $(window).on('resize', function() {
        scaleVideoContainer();
        scaleBannerVideoSize('.video-container .poster img');
        scaleBannerVideoSize('.video-container .filter');
        scaleBannerVideoSize('.video-container video');
    });

});

function scaleVideoContainer() {

    var height = $(window).height() + 5;
    var unitHeight = parseInt(height) + 'px';
    $('.homepage-hero-module').css('height',unitHeight);

}

function initBannerVideoSize(element){

    $(element).each(function(){
        $(this).data('height', $(this).height());
        $(this).data('width', $(this).width());
    });

    scaleBannerVideoSize(element);

}

function scaleBannerVideoSize(element){

    var windowWidth = $(window).width(),
    windowHeight = $(window).height() + 5,
    videoWidth,
    videoHeight;

    // console.log(windowHeight);

    $(element).each(function(){
        var videoAspectRatio = $(this).data('height')/$(this).data('width');

        $(this).width(windowWidth);

        if(windowWidth < 1000){
            videoHeight = windowHeight;
            videoWidth = videoHeight / videoAspectRatio;
            $(this).css({'margin-top' : 0, 'margin-left' : -(videoWidth - windowWidth) / 2 + 'px'});

            $(this).width(videoWidth).height(videoHeight);
        }

        $('.homepage-hero-module .video-container video').addClass('fadeIn animated');

    });
}

Need a custom video or to edit shots?

Check out Veed.Me

Need a coder for your site?

Check out CodersClan

Get emails when new Coverrs are up


Top