My videos are working perfectly in Firefox and Chrome, however they are not rendering properly in Internet Explorer. I have a Joomla site (with K2) and I'm using the AllVideos plugin that uses JW Player. In the configuration for both JW Player and AllVideos, I have chosen the responsive layout. However, in IE, the video does not stretch to the full dimensions. When I re-size it, it gradually disappears into the top left corner, until it is completely gone. It just displays as a black screen but the video is still running, the controls are still there and the audio works. Has anyone else had anything like this happen before? Any ideas on how to fix it? I've tried so many things, and nothing has worked so far.
Hmm.. that might be it. The video div has a top: 0; left: 0; and when I add the !important tag to those two styles it gets even worse (more pushed in the top left corner). When I remove them altogether, nothing changes. Can you take a look at my code and see if you notice anything? Here's my code followed by my CSS:
It looks like line 25 of template.css is causing the issue. If you inspect the element in IE 11’s Developer Tools and uncheck all of the styles for that block, the video appears normally.
.avVideo .avPlayerContainer .avPlayerBlock > div {position:absolute!important;top:0;left:0;min-width:320px!important;width:100%!important;height:100%!important;}
Please let me know if you need any more help or have any other questions.
Thank you!
This question has received the maximum number of answers.