Solved

Html5 video intro and show site

Posted on 2014-03-24
5
1,081 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 52

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 52

Accepted Solution

by:
Scott Fell,  EE MVE earned 500 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

ScreenConnect 6.0 Free Trial

At ScreenConnect, partner feedback doesn't fall on deaf ears. We collected partner suggestions off of their virtual wish list and transformed them into one game-changing release: ScreenConnect 6.0. Explore all of the extras and enhancements for yourself!

Question has a verified solution.

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

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

777 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