top of page

PAGE ONE

Click the button " Reveal Video" , a video appears and plays. When video ends I want it to hold on the last frame of the video then I want it to load page two.

Note: I've watermarked the First and Last Frame here:

>>>

Duration: 8.81seconds

video layout no controls.jpg

The Code for this page:

 

import wixlocation from "wix-location";

 

$w.onReady(function () {

     let duration = $w("#videoPlayer1").duration;

    console.log(duration)

});

​

export function button1_click(event) {

    

    $w("#videoPlayer1").show();  // un-hides the videoplayer

    $w("#videoPlayer1").play();  // plays the video 

    

    // Thank you @russian-dima and @Ajit Kumar for your help in solving this code puzzle. 

​

    let timeOut = Number(8) * Number(1000);  // After testing with this https://www.media-junkie.com/video-stop

    // I found that 12 got me closest to the last frame on slow devices. 

    // The frame it pauses on, varies from device to device.

    // A slower connection and/or device and the video pauses way too early, especially if video is expanded.

    // I've been using a slow laptop. For a good connection and/device i chose 8 to get the desired results

    setTimeout(function() {$w("#videoPlayer1").pause()}, timeOut);

     

    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4

    // Add your code for this event here: 

}


export function videoPlayer1_pause(event) {

    wixlocation.to("https://iammany71.wixsite.com/mysite-1/next-page-that-loads-after-video-he"); // loads next url

    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4

    // Add your code for this event here: 

}

VideoPlayer1 set to hidden On Pause load
bottom of page