Internet Explorer, Flash Player, and z-index
At work we are encouraged to pick up and fix medium bugs when we have time, especially the ones which are out of their SLA time period. I like to challenge myself and attempt to fix the older bugs because they usually have been looked by other devs who gave up on them. So this particular bug seemed juicy to me. It was two months old and on the surface seemed easy. The Brightcove flash player was appearing in front of the modal window instead of behind it, but only in Internet Explorer.
When I went to the link supplied in the bug report in IE 11, I saw the issue. I went to same URL in Chrome and Firefox and there was no issue. I tried IE 10 as well and the issue was there too, so it is definitely an issue only with IE.
Eventually I tracked the issue down to a missing <param>. It seems Brightcove player markup on that particular page is missing a
<param name="wmode" value="transparent" />
When that <param> is missing Brightcove uses what appears to be the default:
<param name="wmode" value="window" />
This is the statement which gives the flash player the ultimate z-index in Internet Explorer. So fixing the bug once I understood what was causing it was pretty easy. In order to test if my idea was correct, I actually wrote some code in FiddleScript to inject the missing markup onto the page. This was faster than fixing directly in the source code since this page was in our CMS system not in our source code.
When I went to the link supplied in the bug report in IE 11, I saw the issue. I went to same URL in Chrome and Firefox and there was no issue. I tried IE 10 as well and the issue was there too, so it is definitely an issue only with IE.
Eventually I tracked the issue down to a missing <param>. It seems Brightcove player markup on that particular page is missing a
<param name="wmode" value="transparent" />
When that <param> is missing Brightcove uses what appears to be the default:
<param name="wmode" value="window" />
This is the statement which gives the flash player the ultimate z-index in Internet Explorer. So fixing the bug once I understood what was causing it was pretty easy. In order to test if my idea was correct, I actually wrote some code in FiddleScript to inject the missing markup onto the page. This was faster than fixing directly in the source code since this page was in our CMS system not in our source code.
