After a lot of searching, I found the solution that worked for me back to IE8. Have not tested in IE7.
How can I display an image if browser does not support HTML5’s <video> tag
The above post, shows a method that seems to work for me. Here is the output based on my above code:
<video autoplay>
<source src="https://stackoverflow.com/resources/video/product-hero.mp4.mp4" type="video/mp4; codecs="avc1.42E01E, mp4a.40.2"" />
<source src="/resources/video/product-hero.webmhd.webm" type="video/webm; codecs="vp8, vorbis"" />
<img src="/images/product/product-parent-hero.jpg" title="Your browser does not support the <video> tag">
</video>