Сергей

Как вариант - просто сделать каждый подпункт отдельным списком и задать всем одинаковый margin-left.

<ul>
<li>
Это первый пункт...
<ul>
<li>
Это второй пункт...
<ul>
<li>
И так далее...
</li>
</ul>
</li>
</ul>
</li>
</ul>

Используйте .show() / .hide() jQuery.
На ccs можно зафиксировать блок в нужном месте через position: absolute и z-index.

SetTimeout'ом такое отслеживать незачем.
Решение - максимально упростить вашу проверку и навесить на все кнопки.
Например, проверку можно обернуть в функцию, которая принимает sum.length и делает с ней все, что вам надо. Коротенький вызов потом распихать по кнопкам.
Еще можно веб-сокеты использовать, но это, мне кажется уже бред сумасшедшего будет совсем...

Лучший вариант - простейший вариант ©

Если проскролили больше пикселей, чем высота шапки
    Даем шапке position:fixed
    Навешиваем любую анимацию

// Тем же макаром обратная ситуация

Не благодарите :)

Это просто бесшовная текстура из нескольких кистей.