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

Why does my embed yield a different result?

Since upgrading to version 7, all my videos are out of alignment as far as the time bar as volume bar. They're aligned to the top. Take a look: http://faithcabot.org/sermons/2015/Buying_up_Opportunities.php

I thought I'd start from scratch and use the embed code found at the tutorial here: http://support.jwplayer.com/customer/portal/articles/1406723-basic-video-embed

My result is the same. Check it out: http://faithcabot.org/here.html

What am I doing wrong here? Why can't I get the time bar and volume bar center-aligned?

7 Community Answers

MisterNeutron

Best Answer 

You need to give your page a proper DOCTYPE:

<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>

(and so on)

View in conversation
Up Down

mark

User  
0 rated :

and*

AND volume bar, not AS volume bar

Up Down

mark

User  
0 rated :

I am "mark" different to "mark " who posted.
Mate, I don't know. I have seen this is many samples, embeds and I cant work it out. My on setup does not show this problem

Up Down

MisterNeutron

Best Answer  User  
0 rated :

You need to give your page a proper DOCTYPE:

<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>

(and so on)

Up Down

Andrew

JW Player Support Agent  
0 rated :

Mr Neutron wins the prize here. Doctype is required to get the controls to display correctly. :)

Up Down

MisterNeutron

User  
0 rated :

To be more precise, it looks like only the HTML5 DOCTYPE will do - it seems to choke on deprecated DOCTYPEs like XHTML or HTML4. For those using a web-authoring tool that doesn't have the option of using HTML5, that could be a serious impediment - simply changing the DOCTYPE without making the rest of the code HTML5-compliant can't be recommended.

Up Down

mark

User  
0 rated :

YES! THANK YOU!!!

Up Down

guyparker

User  
0 rated :

I agree that blindly changing the DOCTYPE to html is not likely to work everywhere.

I found that adding the following CSS rule to the page allowed me to keep my existing DOCTYPE and have the sliders vertically align correctly.

.jw-slider-horizontal { padding-top: 7px !important; }

Thought it might help others get closer to what they want.

This question has received the maximum number of answers.