I really dislike the new loading bar in the YouTube site as videos continue to play while the next page is loaded.<p>I'm on a fast connection so normally youtube loads instantly anyway, but this new method takes 4-10 seconds.
Yep, I've also seen that. But your markup is wrong.
You should use <progress> instead<p>I am using a kde widget called adjustable-clock which uses html5/css3/javascript and qml to render my system clock.<p>Here's the source for the current clock I use, it uses a progressbar for the seconds: <a href="http://htmlpaste.com/7e957bb5523fa58f98b6657073c4a544942a13c3" rel="nofollow">http://htmlpaste.com/7e957bb5523fa58f98b6657073c4a544942a13c...</a><p>QML:<p><pre><code> Clock.setRule('#hour', Clock.Hour);
Clock.setRule('#minute', Clock.Minute);
Clock.setRule('#second', 'value', Clock.Second, {'short': true});</code></pre>
I did the same on <a href="https://www.mila.com" rel="nofollow">https://www.mila.com</a><p>It's fairly simple but it took some time to figure out the right sequence and timing for it to run smoothly across all devices / browsers.
I like it. Just remember if you use this in production, save $("#progress") in a variable in the ajaxStart function to improve performance (this will call Sizzle one less time usually).