только что думал над этим вопросом и сделал такое решение.
разделил 360 на 20 и получился прогресс бар с интервалом в 5%;
можно сделать меньше интервал увеличив максимальное 360 / число блоков.
без JS, только CSS3 jsfiddle.net/SergeyGuns/ttk8o0fa
Начни с sorex на youtube. Раз 5 JavaScript посмотри. Потом переходи на литературу 'Выразительный JavaScript'. . Потом learn.JavaScript.ru. и все чательно втерать по часику(или три, но не больше) в день. Понимание придет. Сам такой же.
Safari разрабатывается на базе chromium. Нужно проверять на всех актуальных браузерах и разрешениях(ретина дисплеи тоже). Чем проще верстка тем меньше гемороя.