#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2013
    Posts
    11
    Rep Power
    0

    HTML5 and jQuery Help (go to page when video ends)


    Hello Every One!
    I need a small help of JQuery.
    I am interested to appear the next web page say 'next-homepage.html' with transition effect of 'FadeIn' just after the completion of video on a very first home page.

    Below is the code of video home page:

    Code:
    video-home.html
    <div class="video"> 
    <video autoplay> 
    <source src="video.webm" type="video/webm"> 
    <source src="video.mp4" type="video/mp4"> 
    <source src="video.ogg" type="video/ogg"> 
    <object data="video.mp4" > 
    <embed src="video.swf" > 
    </object> 
    </video> 
    </div>
    Code:
    next-homepage.html
    <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <p> I am the Next HOme Page....</p></body> </html>

    Kindly advice
    I will be grateful for a quick reply along with solution.
  2. #2
  3. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,127
    Rep Power
    119
    Try this:
    Code:
    $("document").ready(function(){
       $(".video video").bind("ended",function(){
        $(location).attr("href","next-homepage.html");
      })
    });
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2013
    Posts
    11
    Rep Power
    0
    Yes! its working ... but how to add Fade IN effect while appearing the next-homepage.html

    Thank you for your help....
  6. #4
  7. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,127
    Rep Power
    119
    Originally Posted by maha rafa
    Yes! its working ... but how to add Fade IN effect while appearing the next-homepage.html

    Thank you for your help....
    jQuery .fadeIn() API

IMN logo majestic logo threadwatch logo seochat tools logo