Beim Scrollen die Deckkraft der Kopfzeile ändern?

Ich bin so neu in JQuery und ich bin mir sicher, dass die Antwort super einfach ist. Aber wenn jemand mich in die richtige Richtung lenken kann, wäre das großartig. Ich möchte nur, dass sich die Deckkraft meines Headers von 0 auf 1 ändert, wenn der Benutzer einen Bildlauf über 400 Pixel durchführt. HILFE? www.HULU.com hat ein perfektes Beispiel.

<code>
<script>
$(document).ready(function() {
        $(window).scroll(function() {
            if ($(this).scrollTop() > 400) {
                $('.header').css("background", "#000");
            } else {
                $('.header').css("background", "transparent");
            }
        });
        });
</script>
</code>