Here's one I did for a site not too long ago... This one shows the ads on pause and when the video ends... It won't show when embedded on another site.. but with a little research you can figure out how to add the html inside the js functions so that it will...
CSS: (this WILL need to be modified based on your side layout/config)
#player-content {
display: none;
position: absolute;
width: 640px;
height: 447px;
background-color: #000;
padding: 0;
margin: 35px 0 0 20px;
opacity: 0.95;
text-align: left;
}
#player-content-banner {
position: absolute;
bottom: 75%;
width: 661px;
text-align: center;
}
------------------------------
Player:
<div id="player"></div>
<div id="player-content">
<div id="player-content-banner">
<div style="position: relative; top: 160px;">
AD CONTENT HERE
</div>
</div>
</div>
<script type="text/javascript" src="/player/jwplayer/jwplayer.js"></script>
<script type="text/javascript">
$(function()
{
$('#icon-resume').click(jwResume);
$('#icon-replay').click(jwReplay);
});
jwplayer('player').setup({
flashplayer: '/player/jwplayer/player.swf',
id: 'jwplayer',
width: '640',
height: '480',
skin: '/player/jwplayer/glow.zip',
file: 'url/to/video',
autostart: 'true',
provider: 'video',
events:
{
onPause: jwOnPause,
onPlay: jwContentHide,
onComplete: jwOnFinish
}
});
function jwResume()
{
jwplayer()
.play(true);
}
function jwReplay()
{
jwplayer()
.playlistNext();
}
function jwOnFinish()
{
$('#icon-replay').show();
$('#icon-resume').hide();
jwContentShow();
}
function jwOnPause()
{
$('#icon-resume').show();
$('#icon-replay').hide();
jwContentShow();
}
function jwContentHide()
{
$('#player-content')
.hide();
}
function jwContentShow()
{
var position = $('#player').position();
$('#player-content')
.css({top: position.top + 'px', left: position.left + 'px'})
.show();
}
</script>