This is a quick demo of how you can do less obtrusive annotations on videos than YouTube using CSS3 and HTML5. It was part of a workshop at the Mozilla Festival in London, 4-6 November 2011.
Just play the video to see the annotations showing up. Instead of fully covering the video with all the data you can define semi-transparent sections that only get fully visible and show the link texts when you roll over the video.
Video Dancing Robots by Scott McReynolds
<ul class="labels">
<li data-start="3" data-end="10" data-top="40px" data-left="40px"
data-height="100px" data-width="200px">
<p><a href="http://mozilla.org">Mozilla</a></p>
</li>
<li data-start="20" data-end="30" data-top="40px" data-left="40px"
data-height="100px" data-width="200px">
<p><a href="http://www.allizom.org/en-US/firefoxlive">Firefox live</a></p>
</li>
</ul>
You can see how it works in the source code of this page. For more detailed documentation, check the article on the Mozilla Developer Wiki