Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Html5 video intro and show site

Posted on 2014-03-24
5
Medium Priority
?
1,295 Views
Last Modified: 2014-05-24
how do you put an html5 video has an intro nd then show the site (same as flash intro) ? You do a simple JS redirect ? or  there is other tricks ?
And how to do make the animation start automaticaly without the controls buttons (back & fortword...).
0
Comment
Question by:ymazal_ca
  • 2
5 Comments
 
LVL 54

Expert Comment

by:Scott Fell, EE MVE
ID: 39950168
You would use javascript and detect when the movie is done.  

You can use videojs http://www.videojs.com/  and there is an api for the video being complete https://github.com/videojs/video.js/blob/stable/docs/api/vjs.Player.md#ended-event

However, "flash" intro's are rare for a reason.  Viewers really don't want to sit through an intro.  Just take them to your home page and offer your video there.  I know site owners keep wanting to add these things, but site viewers don't want to wait.
0
 

Author Comment

by:ymazal_ca
ID: 39950218
Can't you put some how a "skip inro" on the video thrue JavaScript ? This way you could skip the intr if you don't feel like seeing it...

The problem it an html5 movie, not flash...
0
 
LVL 54

Accepted Solution

by:
Scott Fell,  EE MVE earned 2000 total points
ID: 39950264
You can play a video intro just as you would flash.  Videojs is just one player and if you go to docs > player api doc https://github.com/videojs/video.js/blob/stable/docs/api/vjs.Player.md you can see all the events you can have access to.  

One of those events is the ended event.  They have sample code but you can add whatever you want.  
vjs.Player.prototype.onEnded = function(){
  if (this.options_['loop']) {
    this.currentTime(0);
    this.play();
  }
};

Open in new window


What you might try is adding a modal to the  home page and when the page loads, show the modal which will contain the video.  All they have to do is click outside the modal to get to the home page and you can have an ended event that closes the modal.  I would add a cookie that they have already visited the home page and not show the intro again to the same person though.    

If you think it is of interest to see a 2nd or 3rd time, you can have a link that will display the modal/video.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
Without even knowing it, most of us are using web applications on a daily basis.  In fact, Gmail and Yahoo email, Twitter, Facebook, and eBay are used by most of us daily—and they are web applications. We generally confuse these web applications to…
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.
Suggested Courses

916 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question