Примеры скриптов на языке JavaScript, Изменение фона документа

Изменение фона документа.

Изменение фона документа при выборе кнопки с названием цвета. При этом используется свойство bgColor объекта Document.Свойство bgColor в Netscape Navigator 2.0 содержит ошибки.


<html>

<head>

<title>bgcolor</title>

</head>

<body text=000000 bgcolor=ffffff>

<table border=0 align=center>

<tr><td><form>

<input type=button value="красный" onClick="document.bgColor='ff0000'">

<input type=button value="желтый" onClick="document.bgColor='ffff00'">

<input type=button value="синий" onClick="document.bgColor='0000ff'">

<input type=button value="голубой" onClick="document.bgColor='87ceeb'">

<input type=button value="коралловый" onClick="document.bgColor='ff7f50'">

</form></td>

</table>

</body>

</html>

Документ с изменяющимся фоном.


<html>

<head>

<title>Изменение фона документа</title>

<script>

function bg_Array() {

  this.length = bg_Array.arguments.length

  for (var i = 0; i< this.length; i++)

    this[i+1] = bg_Array.arguments[i]

}

var bg_Chars = "0123456789ABCDEF";

function Dec2Hex (Dec) {

  var a = Dec % 16;

  var b = (Dec - a)/16;

  hex = "" + bg_Chars.charAt(b) + bg_Chars.charAt(a);

  return hex;

}

function bg_Changer (begin, end, steps) {

  steps = steps -1 ;

  redA     = begin.charAt(0) + begin.charAt(1);

  red_valA = parseInt(redA,'16');

  redB     = end.charAt(0) + end.charAt(1);

  red_valB = parseInt(redB,'16');

  red_int  = ((red_valB - red_valA) / steps) * -1;

  grnA     = begin.charAt(2) + begin.charAt(3);

  grn_valA = parseInt(grnA,'16');

  grnB     = end.charAt(2) + end.charAt(3);

  grn_valB = parseInt(grnB,'16');

  grn_int  = ((grn_valB - grn_valA) / steps) * -1;

  bluA     = begin.charAt(4) + begin.charAt(5);

  blu_valA = parseInt(bluA,'16');

  bluB     = end.charAt(4) + end.charAt(5);

  blu_valB = parseInt(bluB,'16');

  blu_int  = ((blu_valB - blu_valA) / steps) * -1;

  step = 2;

  red = red_valA;

  grn = grn_valA;

  blu = blu_valA;

  document.bgColor = begin;

  while ( steps >= step ) {

    red -= red_int;

    red_round = Math.round(red);

    red_hex = Dec2Hex(red);

    grn -= grn_int;

    grn_round = Math.round(grn);

    grn_hex = Dec2Hex(grn);

    blu -= blu_int;

    blu_round = Math.round(blu);

    blu_hex = Dec2Hex(blu);

    document.bgColor = red_hex + grn_hex + blu_hex;

    step++;

  }

  document.bgColor = end;

}

for (j=0;j<5;j++) {

  bg_Changer("ffff00","00ff00",50);

  bg_Changer("00ff00","ff0000",50);

  bg_Changer("ff0000","0000ff",50);

  bg_Changer("0000ff","f0ffff",50);

  bg_Changer("f0ffff","7fff00",50);

  bg_Changer("7fff00","ff00ff",50);

  bg_Changer("ff00ff","00ffff",50);

  bg_Changer("00ffff","eee8aa",50);

  bg_Changer("eee8aa","ffb6c1",50);

  bg_Changer("ffb6c1","98fb98",50);

  bg_Changer("98fb98","afeeee",50);

}

</script>

</head>

<body>

</body>

</html>