Add background Image to Multiple Players
I have 3 videos on one web page using this coding:
<div id='myElement1'>Loading the player ...</div>
<script type='text/javascript'>
var playerInstance = jwplayer('myElement1');
playerInstance.setup({
playlist: [{
sources: [{
file: "graphics/Homeland_Security.flv"
},{
file: "graphics/Homeland_Security.mp4"
},{
file: "graphics/Homeland_Security.webm"
}]
}],
primary: 'flash',
width: '358',
height: '252',
image: 'graphics/Homeland_Security.jpg'
});
</script>
<p>
<div id='myElement2'>Loading the player ...</div>
<script type='text/javascript'>
var playerInstance = jwplayer('myElement2');
playerInstance.setup({
playlist: [{
sources: [{
file: "graphics/7_Signs_Of_Terrorism.flv"
},{
file: "graphics/7_Signs_Of_Terrorism.mp4"
}]
}],
primary: 'flash',
width: '358',
height: '252',
image: 'graphics/7_Signs_Of_Terrorism.jpg'
});
</script>
<p>
<div id='myElement3'>Loading the player ...</div>
<script type='text/javascript'>
var playerInstance = jwplayer('myElement3');
playerInstance.setup({
playlist: [{
sources: [{
file: "graphics/observations.flv"
},{
file: "graphics/observations.mp4"
}]
}],
primary: 'flash',
width: '358',
height: '252',
image: 'graphics/observations.jpg'
});
</script>
The 3 preview images however are not showing up. I have tried adding them under each file attribute, but they're still not showing up. Any ideas?
