De uitwerking

Een kleurcombinatietester


Vul in de vakken een aantal kleuren in, of hexadecimale kleurcodes. Zodra u op de knop `Bekijk' klikt, ziet u een venster met de kleurcombinaties van uw keuze

Eigenschap Kleur
Achtergrondkleur
Voorgrondkleur
Kleuren voor links
Kleuren voor gevolgde links
Kleuren voor active links

De code

<html>
<head>
<title>Oefening 7.4: Een kleurencombinatietester </title>
<script language="JavaScript">
<!--
function kleurtekst(tekst, kleur){
  var string = '<font size="+2" color="' +kleur + '">';
  string += tekst ;
  string += '</font><br>';
  return string;
}

function Eigenschappen(){
  var string1;
  var string2;
  var bodystring;

  var voor = document.formulier.fground.value;
  var achter = document.formulier.bground.value;
  var link = document.formulier.link.value;
  var alink = document.formulier.alink.value;
  var vlink = document.formulier.vlink.value;
  var windowFeatures = 'width=400,height=300,toolbar=no,scrollbars=yes,menubar=yes';

  bodystring = '<body bgcolor="' + achter +'" text="' + voor + '" link="' + link +'" vlink="' + vlink + '" alink="' + alink + '">';
  string1 = '<html><head><title>Combinaties</title></head>';
  string1 += bodystring;
  string1 += '<div align="center"><h2 align="center">Uw combinaties voor deze pagina</h2><hr width="75%">';

  string2 = kleurtekst ('Gewone tekst heeft deze kleur', voor);
  string1 += string2;

  string2 = kleurtekst ('Links hebben deze kleur', link);
  string1 += string2;

  string2 = kleurtekst ('Active Links hebben deze kleur', alink);
  string1 += string2;

  string2 = kleurtekst ('gevolgde links hebben deze kleur', vlink);
  string1 += string2;

  myWin= open('', 'Eigenschappen', windowFeatures);
  myWin.document.write(string1);
  string2 = '<form><input type="button" Value="Sluit Venster" onClick="self.close()"></form>';
  string2 += '<hr width="75%"></div></body></html>';
  myWin.document.write(string2);
  myWin.document.close();
}
//-->
</script>

</head>
<body>
<div align="center">
<h2>Een kleurcombinatie-tester</h2>
<hr width=50%>
Vul in de vakken een aantal kleuren in, of hexadecimale kleurcodes.
Zodra u op de knop `Bekijk' klikt, ziet u een venster met de kleurcombinaties
van uw keuze
<p>
<form name="formulier">
<table cellpadding=5 border=1>
<tr>
  <th>Eigenschap </th>
  <th>Kleur</th>
</tr>
<tr>
  <td>Achtergrondkleur </td>
  <td><input type="text" name="bground"> </td>
</tr>
<tr>
  <td>Voorgrondkleur </td>
  <td><input type="text" name="fground"></td>
</tr>
<tr>
  <td>Kleuren voor links </td>
  <td><input type="text" name="link"></td>
</tr>
<tr>
  <td>Kleuren voor gevolgde links </td>
  <td><input type="text" name="vlink"></td>
</tr>
<tr>
  <td>Kleuren voor active links </td>
  <td><input type="text" name="alink"></td>
</tr>
</table>
<input type=button value="Bekijken" onClick="Eigenschappen()">
</form>
<hr width=50%>
</div>
</body>
</html>

Terug naar de vragen