Forum
Crosstec Forums
Coding - Consultancy - Ideas
Next Page button after Video ends

TOPIC:

Next Page button after Video ends 1 month 3 weeks ago #251051

  • Topic Author
  • emman
  • Offline
  • Fresh Breezer
  • Fresh Breezer
  • Posts: 11
  • Thanks: 0
Good day. I have a page that has a video uploaded. My problem is I need the users to watch the video before they can proceed to the next page. Is there any way to this? Thank you.

Please Log in or Create an account to join the conversation.

Next Page button after Video ends 1 month 3 weeks ago #251055

  • tihana.krivic's Avatar
  • tihana.krivic
  • Offline
  • Moderator
  • Moderator
  • Posts: 3007
  • Karma: 3
  • Thanks: 257
Hi,

I am not sure for this, but before I test it, I have a question.
Did you add this video in section?
Is this video youtube video or?

Regards,
Tihana

Please Log in or Create an account to join the conversation.

Next Page button after Video ends 1 month 3 weeks ago #251058

  • Topic Author
  • emman
  • Offline
  • Fresh Breezer
  • Fresh Breezer
  • Posts: 11
  • Thanks: 0
I add the video on the Page, the video is uploaded on our domain.

Please Log in or Create an account to join the conversation.

Next Page button after Video ends 1 month 3 weeks ago #251065

  • tihana.krivic's Avatar
  • tihana.krivic
  • Offline
  • Moderator
  • Moderator
  • Posts: 3007
  • Karma: 3
  • Thanks: 257
Hi,

this only can be done with custom submit button.

Steps are the following:

1)In your form->Properties->Paging include->set it to No.
After that on every form's page add new element->Submit button->and name it: Next page (Title), nextpage(Name), Next(Value).
On this button->Advanced->Actionscript->check Library->check Click->and as script select ff_next page.
Don't forgot to add this button on each page, because this acts Next button

2) in you page in which is video add id of your video.
e.g (this is my code for video):
<video id='myvideo' #videoplayer controls (ended)="videoEnd()" style="width: 600px;" >
    <source 
      src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerEscapes.mp4" 
      type="video/mp4"> 
        Your browser does not support HTML5 video.
</video>
As you can see id of this video is 'myvideo'.
As I said in step 1) add submit button as next button on this page too.

3) go to your form->Advanced->More options->Scripts->Initialization script->check Custom:
function ff_example2311_init()
{
setInterval('myV()', 500);
} // ff_example2311_init

function myV() {
var myVideo = document.getElementById("myvideo"); 
if (myVideo.played) {
jQuery('#ff_elem24163').prop('disabled',true);
}
 if (myVideo.ended){
jQuery('#ff_elem24163').prop('disabled',false);
}
}
Please replace #ff_elem24163 with ID of button which is located on page on which is video. (you can find this ID with right click to your browser->Inspect)

myvideo is ID of video from step 2)->replace it with your video id.

I hope I explained the steps well and did not confuse you :)

If you need more help, let me know

Regards,
Tihana
The following user(s) said Thank You: emman

Please Log in or Create an account to join the conversation.

Last edit: Post by tihana.krivic.

Next Page button after Video ends 1 month 3 weeks ago #251092

  • Topic Author
  • emman
  • Offline
  • Fresh Breezer
  • Fresh Breezer
  • Posts: 11
  • Thanks: 0
Good day.

Whenever I tried to save the page after copying your code for the video the code always revert to this:
<p><video id="myvideo" style="width: 600px;" controls="controls">
   source src="videos/orientation.mp4" type="video/mp4" /&gt; 
        Your browser does not support HTML5 video.
</video></p>

Update:

I followed your instructions but the button were not disabled. Please see the attached for the screenshots of the settings.
Attachments:

Please Log in or Create an account to join the conversation.

Last edit: Post by emman.

Next Page button after Video ends 1 month 3 weeks ago #251105

  • tihana.krivic's Avatar
  • tihana.krivic
  • Offline
  • Moderator
  • Moderator
  • Posts: 3007
  • Karma: 3
  • Thanks: 257
Hi,

can I access to your page and try to solve this?

Regards,
Tihana

Please Log in or Create an account to join the conversation.

  • Page:
  • 1
  • 2
Forum
Crosstec Forums
Coding - Consultancy - Ideas
Next Page button after Video ends
Time to create page: 0.050 seconds

BreezingForms Pro 1.4.7 for WordPress Released!

Available in the membership section.

September Discount!

Massive discounts on all subscriptions!

Get Your Subscription Here

Quick Links

Downloads

BreezingForms

ContentBuilder

BreezingCommerce

Templates

Documentation

BreezingForms

ContentBuilder

BreezingCommerce

Apprendre BreezingForms (French Community)

Apprendre et maîtriser BreezingForms par des tutoriels et exemples, le tout en français

breezingforms.eddy-vh.com

Questions et réponses sur les forums de l'AFUJ

AFUJ

Special Offer

Summer Sale! All subscriptions at a special price!

Includes prio support, all of our current and future Joomla!® extensions and Joomla!® templates for the duration of your membership.

Get it from here

3rd Party Discount - 25% Off

We help you to keep your costs under control. If you are a new member and purchased a form building tool from a different form vendor, then you'll get a 25% discount on our subscription plans.

How to receive the discount:

Send us a quick email to sales@crosstec.org with a proof of purchase (for example a paypal receipt), await payment instructions and enjoy your membership!