Could someone help me with this script?

Question

Good to script :

$(document).ready(function(){

    $("#banner").css({"height":$(window).height() + "px"});

    var flag = false;
    var scroll;

    $(window).scroll(function(){
        scroll = $(window).scrollTop();

        if(scroll > 200){
            if(!flag){
                $("#logo").css({"margin-top": "-5px", "width": "50px","height":"50px"});
                $("nav").css({"color": "#fff"});
                $("ul").css({"color": "#000"});
                flag = true;
            }
        }else{
            if(flag){
                $("#logo").css({ "width": "80px","height":"80px"});
                $("ul").css({"color": "#000"});
                $("header").css({"background-color": "#fff"});
                flag = false;
            }
        }


    });

});

Html part of Nav:

<header class="header">
        <nav>
            <ul>
                <a href="http://www.keyquotes.es"><li>Youtube</li></a>
                <a href="http://www.keyquotes.es"><li>Nosotros</li></a>
                <a href="http://www.keyquotes.es"><li>Contacto</li></a>
            </ul>

                <img id="logo" src="pictures/logo.png">

            <ul>
                <a href="http://www.keyquotes.es"><li>Youtube</li></a>
                <a href="http://www.keyquotes.es"><li>Nosotros</li></a>
                <a href="http://www.keyquotes.es"><li>Contacto</li></a>
            </ul>
        </nav>

</header>

I wanted to understand what is missing or where I am missing, my intention with this script is that when the page is in the top ul gets black img:

and when rolling the scroll it turns white as in img:

And then I added this to the script: $("ul"). css({"color": "#000"}); and $("ul"). css({"color": "#fff"}); and was not the best option?

Answer 1

Come on, you don’t need this flag and the correct to change the color is $("nav ul a")

  $(window).scroll(function(){
    scroll = $(window).scrollTop();
    if(scroll > 200){
            $("#logo").css({"margin-top": "-5px", "width": "50px","height":"50px"});
            $("nav ul a").css({"color": "blue"});                
            $("header").css({"background-color": "#fff"});
    }else{
            $("#logo").css({ "width": "80px","height":"80px"});
            $("nav ul a").css({"color": "#fff"});
            $("header").css({"background-color": "#000"});

    }

});

https://jsfiddle.net/k41t9n52/3/