how is it possible to put a div over a jwplayer5 video?

Question

The problem is that on IE the video jwplayer5 goes over everything, and my goal is the user to avoid to click over the video, to prevent PLAY/PAUSE effects. i was suggested to put a div over the video, I did it, but on Internet Explorer (i'm checking 9) is not working.

any known working suggestions?

this is my video:

var video1 = jwplayer('vid1').setup({
            'flashplayer': 'html/js/jwplayer5/player.swf',
            'id': 'playerVid1',
            'width': VIDPLAYER_CTRL.BIGVIDEO_WIDTH,
            'height': VIDPLAYER_CTRL.BIGVIDEO_HEIGHT,
            'file': VIDPLAYER_MODEL.MAIN_VIDEO['path'],
            'provider': 'http',
            'startparam': 'start',
            'controlbar': 'bottom',
            'image': VIDPLAYER_MODEL.MAIN_VIDEO['path_img'],
            wmode: 'transparent',
            'skin': 'html/js/jwplayer5/videoSkin/videoSkin.xml'
});

and this is my div where video is:

<div id="area1" class="aree">
        <div id="vid1_cover1" class="cover1big"></div>
        <div id="vid1_cover2" class="cover2big"></div>
        <div id="vid1"></div>
</div>

and this is the css to create a overlay div OVER the video:

  div.cover1big{
     background-color: transparent;
     position: absolute;
     width: 601px;
     height: 335px;
     top:0px;
     left:0px;
     z-index: 999;
  }
  div.cover2big{
     background-color: transparent;
     position: absolute;
     width: 576px;
     height: 26px;
     top:335px;
     left:25px;
     z-index: 999;
  }

When you say it's not working in IE, are your transparent DIV elements not appearing above the video, or are they just not stopping the 'click' on the video? — theWizardsBaker, Apr 30 '13 at 15:07
div are transparent. the problem is that they don't stop the click (PLAY or PAUSE) on the jwplayer video — axel, Apr 30 '13 at 15:10
i need two divs on it because i've a skin for some operations on the video, then i need to cover the rest of the video, because i don't want the user click pause or play over the video. — axel, Apr 30 '13 at 15:11
Are you setting the z-index of the player? `#playerVid1 {z-index: 0}` Also, should wmode be in ticks? 'wmode' I'm not sure how strict jwplayer is. — theWizardsBaker, Apr 30 '13 at 15:25
set the z-index to zero. what do you mean with wmode being in ticks? — axel, Apr 30 '13 at 15:29

score 1 · Answer 1 · answered Apr 30 '13 at 15:29

1

I would put the DIV over using the JW5 JS Plugin SDK.

http://www.longtailvideo.com/support/jw5/31166/building-javascript-plugins

There is a hello world example here which creates a div over the player and it works in both Flash and HTML5 modes.

answered Apr 30 '13 at 15:29

emaxsaun

4,191
2
13
13

I've a another question, is it possible maybe to put all over the video the controlbar? i mean, with the skin? – axel Apr 30 '13 at 15:43
Maybe, but that would be much harder. I would try to copy our sample hello world plugin first. ;-) – emaxsaun Apr 30 '13 at 15:46
i tested your link, it works (as the previous adopted solution of the overlays) but it's still not working on internet explorer, is it normal? i'm using jwplayer 5.7.1864 – axel Apr 30 '13 at 16:24
Going to need to send us a link as per our normal support route. – emaxsaun Apr 30 '13 at 16:28
is there a link for jwplayer 5.8? i will have the last test, thanks – axel Apr 30 '13 at 16:34
hi @ethan, can i ask your mail to write you, because of the software privacy. thank you – axel Apr 30 '13 at 17:17

how is it possible to put a div over a jwplayer5 video?

1 Answers1