Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

Control focus being lost on click in JWPlayer overlay

Hi,

I have created an overlay for asking some survey questions (by appending a div into the existing jw-overlays div).

However once you say "Yes I will help" to start the survey, whenever you click on any control in the overlay (e.g. a select or text box) the focus instantly leaves the control again - you'll see a flick of the select options, or the cursor in the text box show and then disappear.

Using tab key "works" so that control isn't lost when you tab to a control. Also if you click and hold down the mouse button, focus is not lost.

I'm not sure if it's a CSS issue or something in JWPlayer taking over, any suggestions?

You can see it in action here by starting to play the video (you can pause it again immeditately): http://uat.mhpn.org.au/WebinarRecording/48/Webinar-for-Kate

You'll see a text box if you chose "Australia" from the location question.

Please note that currently it's set to show immediately on playing, and never "remember" that it's been dismisswed; this is just to help with testing it for now.

Thanks

5 Community Answers

Up Down

w...

User  
0 rated :

I've just created a cut down version here: http://awd.net.au/jwplayer-overlays/

This demonstrates the issue whilst getting rid of a lot of noise (no Bootstrap, no ASP.NET, just straight up HTML and Javascript).

Up Down

Alex

JW Player Support Agent  
0 rated :

Hi there,

I am able to reproduce the behavior you are seeing. Since what you are trying to do is not something we support, I can’t guarantee you are going to have any success appending the overlay to a <DIV> within the player. However, a suggestion that comes to mind would be to possibly setup the overlay’s <DIV> outside of the player but then absolutely position it using CSS.

Thank you.

Up Down

Bron Thulke

User  
0 rated :

Hi Alex,

Sorry I didn't get any alerts about your response for some reason.

If this is not a supported use of the overlay, may I ask what the overlay is there for? Is there some way I can utilise it that is supported?

I've tried having a div outside the player, but when the video is put in full screen mode I can't see a way to have my div show - is there a way to do this? That is the most important thing, as we are asking a question to users while they are playing the video, and we know from useability surveys that most of our users play video in full screen mode.

Thanks,
Bron

Up Down

Bron Thulke

User  
0 rated :

P.S. We have now paid for support (as I didn't think there had been a response to this so wanted to escalate it), so would I be better to raise this as a support ticket?

Up Down

Alex

JW Player Support Agent  
0 rated :

Hi Bron,

Can you elaborate on what you mean by “what the overlay is there for?” If you’re referring to the <div> with the .jw-overlay class, that is for the player’s use when you use a feature that is built-in to the player that requires an overlay. For example, if you are embedding a playlist in the player, we provide a button on the display that a user can click to view the playlist and when that button is clicked, the playlist gets appended into that <div>. The same thing happens if you enable sharing on your player, if the user clicks the sharing icon, an overlay will appear giving them several options to share you content.

What I have seen some customers successfully do in the past is have a video play. When the video completes in fullscreen, it will automatically exit fullscreen. You can then remove the player on the page and replace it with whatever questions you want to ask. When the user finishes the questions, if there is another video you want to play, then you can re-setup a player and load the next video.

Thank you.

This question has received the maximum number of answers.