I forrige lektion lærte at der er noget der hedder 16-tals systemet. Nu skal vi bruge 16-tals systemet til at lave farver med. Når du bevæger musen over de lange røde, grønne og blå firkanter forneden, så vil farven i den store firkant skifte. Alle farver kan dannes ved at man blander rød, grøn og blå. Blandingen kan laves af et tal fra 0 til 255, som når det skrives med hexadecmal kan skrives med to "tal" fra 00 til FF. Når du er tilfreds med farven så klik på skalaen, så stopper skyderen for den pågældende farve. Hvis du senere vil flytte skyderen så klik på den igen.
Vælg indholdet i tekst boksen og tryk på ctrl -C. Bagefter kan du sætte farven ind der hvor du skal bruge den. For eksempel i den firkant du laver i bevægelses-øvelsen.
| Dette tal kan du bruge til at lave farver med: |
og tryk bageveter på Ctrl-C. Sæt ind i et nyt text dokument. Gem det som Skyder.htm. Find Skyder.htm med stifinderen og dobbelt klik på det.
Vi har sat en onload="init()" ind i <body> tag-en. Det gør at init bliver kørt når documentet er kommet ind. Her ligger der nogle finurligheder, der gør at vi kan fange musebevægelser, og museklik, men kun når vi klikker på den røde bjælke som vi har kaldt Roed.
Den lille sorte tab kalder vi id="RMark" . Vi kan få fat i dens position med RMark.style.left. Og når musen bevæger sig så flytter den også.
Vi har været så smarte at lade Roed være lige precis 255 punkter (px eller pixels) bred. Det gør at vi direkte kan oversætte muse bevægelsen til en farve. Det vil sige vi skal lige trække Roeds venstre position fra. Roed.style.left.
Hvis man bare læste Roed.style.left så vil der stå et tal og og så "px" med funktionen parseInt (som er en forkortelse der oversat fra engelsk til dansk betyder "læs heltal") læser vi heltallet ud af. Vi har oprettet en variabel som vi kalder Tival. Med Tival.toString(16) får vi lavet den om til Hexadecimal. Ved at lægge fire 0000 til som text får vi lavet den om til en rød farve.