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

Two players, resize #1 down on completion, resize #2 up on completion of #1

I've got two players on the same page, I want to resize #1 to (1,1px) when it completes, and resize #2 to twice it's height.
I'm a newbie with javascript and couldn't find sufficient examples to get it done. Here's my code:

<div id="myElement1"></div>
<script type="text/javascript">
jwplayer("myElement1").setup({
file: "http://egbn.org/Jwp6test/EGBN_video_logo.mp4",
image: "http:/egbn.org/images/egbn_still_logo.png",
displaytitle: false,
controls: false,
autostart: true,
stretching: "exactfit",
width: "100%",
height: 360
});
</script>

<div id='myElement2'</div>
<!-- resize height: 5 -->
<script type='text/javascript'>
jwplayer().onComplete(jwplayer().resize(5,5));
</script>

<div id='myElement3'</div>
<script type='text/javascript'>
jwplayer('myElement2').setup({
playlist: "http://egbn.org/JWP6test/testplaylist.xml",
listbar: {
position: 'right',
size: 300
},
displaytitle: false,
width: "100%",
height: 360
});
</script>
javascript:jwplayer(1).resize("100%",600);

How do I fix this to accomplish my goals?

BTW, your link on responsive player demo (Check out this demo [http://demo.jwplayer.com/nyvideo/#slide-4] to test out a responsive vs a non-responsive JW Player.) Is Broken...

12 Community Answers

Up Down

Ethan Feldman

JW Player Support Agent  
0 rated :

Where did you get this link from?

http://demo.jwplayer.com/nyvideo/

Instead of using:

jwplayer().onComplete(jwplayer().resize(5,5));

Use this:

jwplayer().onComplete(function() { jwplayer().resize(5,5); jwplayer(‘myElement2’).resize(“100%”,600); });

Up Down

dykesje

User  
0 rated :

@Ethan,

Here's my revised code:

<div id="myElement1"></div>
<script type="text/javascript">
jwplayer("myElement1").setup({
file: "http://egbn.org/Jwp6test/EGBN_video_logo.mp4",
image: "http:/egbn.org/images/egbn_still_logo.png",
displaytitle: false,
controls: false,
autostart: true,
stretching: "exactfit",
width: "100%",
height: 260
});
</script>

<div id='myElement2'</div>
<!-- resize height: 5
<script type='text/javascript'>
jwplayer().onComplete(function() {jwplayer().resize(5,5); jwplayer(‘myElement2’).resize(“100%”,580);})
</script>
-->

<div id='myElement3'</div>
<script type='text/javascript'>
jwplayer('myElement2').setup({
playlist: "http://egbn.org/JWP6test/testplaylist.xml",
listbar: {
position: 'right',
size: 300
},
displaytitle: false,
width: "100%",
height: 320
});
</script>

link is http://egbn.org/index1.html

the first player doesn't resize down, and the second player doesn't resize up.

Why not?

Up Down

dykesje

User  
0 rated :

Ethan,
In answer to your question about the origin of that link:
That link came from this page - http://www.jwplayer.com/blog/new-in-jw-player-responsive-design/

Up Down

Ethan Feldman

JW Player Support Agent  
0 rated :

Thanks, that blog just needs to be updated then. We can get that fixed.

I actually can’t get your players to work here because your mp4 files all have the mime type video/mpeg, but they should all be video/mp4

Up Down

dykesje

User  
0 rated :

Video 1 in the playlist is MP4 Video according to the Properties - Details - Item type when I right-click the video on my WIN8 system. That file was dragged/dropped onto my server.

The other 4 files are youtube videos.

Up Down

Ethan Feldman

JW Player Support Agent  
0 rated :

It is an mp4, but the file can’t be played because the mime type is incorrect, this is a server side setting.

Up Down

dykesje

User  
0 rated :

All six videos play through when I access the website from my browsers. The sixth video is the EGBN_video-logo.mp4 file which was generated just like Video 1 in the playlist, and shows MP4 Video in the Properties list as well.

Up Down

Ethan Feldman

JW Player Support Agent  
0 rated :

Here is the direct error from the console.

HTTP “Content-Type” of “video/mpeg” is not supported. Load of media resource http://egbn.org/JWP6test/A_Nation_of_Agnostics.mp4 failed.

Again, this is not an encoding problem, but an issue with your server.

Also, I only see one player on the page here.

Up Down

dykesje

User  
0 rated :

Ethan,
I've accessed egbn.org/index1.html from Chrome, Firefox, and IE11, and all video files in the playlist play through, as well as the logo_video in player 1. Done so from three different computers in three locations - my network, from a different neighborhood (same city), and Alabama (different state).

Why can't you play it?

Up Down

Ethan Feldman

JW Player Support Agent  
0 rated :

Because, your sever has the wrong mime type.

Here you go – http://i.imgur.com/5BCfje6.png

It is failing for me because it is trying to play in html5 mode for me since i am on a pc, and your server has the wrong mime type set. It needs to be fixed.

Up Down

dykesje

User  
0 rated :

After making some adjustments in the html and the xml playlist files, I have success in having the logo player (#1) removed from the screen after playing, leaving only the multi-video player (#2) on the screen. This is effective in Chrome (desktop, phone, & tab) IE11, and Safari. Firefox presents additional problems. All videos and players appear on the initial Firefox screen, but none of the videos actually play in #1 or #2.
Thanks, Ethan, for all your help and questions that prodded me to additional study and inquiries. My success is a joint effort. Thanks again.

http://egbn.org/

Up Down

Ethan Feldman

JW Player Support Agent  
0 rated :

Set the primary variable to Flash. There are some issues with YouTube in html5 mode right now in Firefox.

This question has received the maximum number of answers.