WordPress.org

Ready to get started?Download WordPress

Forums

JW Player for Flash & HTML5 Video
[resolved] Multiple players with playlists not working (3 posts)

  1. PyroSteveJr
    Member
    Posted 10 months ago #

    Basically when I have one playlist on a page everything works fine. The code looks like:

    <h3>Video Player 1</h3>
    <div style="width: 640px;">
    	<div id="videoPlayer1" align="center">Loading the player...</div>
    </div>
    
    <script type="text/javascript">// <![CDATA[
    	jwplayer("videoPlayer1").setup({
    		flashplayer: "http://localhost/_jwplayer/player.swf", playlist: [
    			{ duration: 253, file: "http://localhost/Misc/Video1.mp4", image: "http://localhost/Misc/Video1.jpg", title: "Video1" },
    			{ duration: 253, file: "http://localhost/Misc/Video2.mp4", image: "http://localhost/Misc/Video2.jpg", title: "Video1" }
    		],
    		'playlist.position': 'bottom',
    		'playlist.size': 120,
    		height: 480,
    		width: 640,
    		volume: 80,
    		'skin': 'http://localhost/_jwplayer/athealthways.zip',
    		autostart: false
    	});
    // ]]></script>

    But when I try to have 2 of them neither load.

    <h3>Video Player 1</h3>
    <div style="width: 640px;">
    	<div id="videoPlayer1" align="center">Loading the player...</div>
    </div>
    
    <h3>Video Player 2</h3>
    <div style="width: 640px;">
    	<div id="videoPlayer2" align="center">Loading the player...</div>
    </div>
    
    <script type="text/javascript">// <![CDATA[
    	jwplayer("videoPlayer1").setup({
    		flashplayer: "http://localhost/_jwplayer/player.swf", playlist: [
    			{ duration: 253, file: "http://localhost/Misc/Video1.mp4", image: "http://localhost/Misc/Video1.jpg", title: "Video1" },
    			{ duration: 253, file: "http://localhost/Misc/Video2.mp4", image: "http://localhost/Misc/Video2.jpg", title: "Video1" }
    		],
    		'playlist.position': 'bottom',
    		'playlist.size': 120,
    		height: 480,
    		width: 640,
    		volume: 80,
    		'skin': 'http://localhost/_jwplayer/athealthways.zip',
    		autostart: false
    	});
    
    	jwplayer("videoPlayer2").setup({
    		flashplayer: "http://localhost/_jwplayer/player.swf", playlist: [
    			{ duration: 253, file: "http://localhost/Misc/Video3.mp4", image: "http://localhost/Misc/Video3.jpg", title: "Video3" },
    			{ duration: 253, file: "http://localhost/Misc/Video4.mp4", image: "http://localhost/Misc/Video4.jpg", title: "Video4" }
    		],
    		'playlist.position': 'bottom',
    		'playlist.size': 120,
    		height: 480,
    		width: 640,
    		volume: 80,
    		'skin': 'http://localhost/_jwplayer/athealthways.zip',
    		autostart: false
    	});
    
    // ]]></script>

    http://wordpress.org/plugins/jw-player-plugin-for-wordpress/

  2. PyroSteveJr
    Member
    Posted 10 months ago #

    Well the second I post this I figured it out. In case someone runs into same problem here is my code. I just had to separate out javascript.

    <h3>Video Plyaer 1</h3>
    <div style="width: 640px;">
    	<div id="videoPlayer1" align="center">Loading the player...</div>
    </div>
    
    <script type="text/javascript">// <![CDATA[
    	jwplayer("videoPlayer1").setup({
    		flashplayer: "http://localhost/_jwplayer/player.swf", playlist: [
    			{ duration: 253, file: "http://localhost/Misc/Video1.mp4", image: "http://localhost/Misc/Video1.jpg", title: "Video1" },
    			{ duration: 253, file: "http://localhost/Misc/Video2.mp4", image: "http://localhost/Misc/Video2.jpg", title: "Video1" }
    		],
    		'playlist.position': 'bottom',
    		'playlist.size': 120,
    		height: 480,
    		width: 640,
    		volume: 80,
    		'skin': 'http://localhost/_jwplayer/athealthways.zip',
    		autostart: false
    	});
    // ]]></script>
    
    <h3>Video Player 2</h3>
    <div style="width: 640px;">
    	<div id="videoPlayer2" align="center">Loading the player...</div>
    </div>
    
    <script type="text/javascript">// <![CDATA[
    	jwplayer("videoPlayer2").setup({
    		flashplayer: "http://localhost/_jwplayer/player.swf", playlist: [
    			{ duration: 253, file: "http://localhost/Misc/Video3.mp4", image: "http://localhost/Misc/Video3.jpg", title: "Video3" },
    			{ duration: 253, file: "http://localhost/Misc/Video4.mp4", image: "http://localhost/Misc/Video4.jpg", title: "Video4" }
    		],
    		'playlist.position': 'bottom',
    		'playlist.size': 120,
    		height: 480,
    		width: 640,
    		volume: 80,
    		'skin': 'http://localhost/_jwplayer/athealthways.zip',
    		autostart: false
    	});
    // ]]></script>
  3. JW Player
    Member
    Plugin Author

    Posted 10 months ago #

    Glad you got it, thanks for sharing!

Reply

You must log in to post.

About this Plugin

About this Topic

Tags

No tags yet.