CSS Gradients Demo 2

HTML; // orange-yellow // 255 0 0 // 255 255 0 // blue // 0 0 64 // 80 200 255 $random = $_POST['random']; if ($random <> 'on') { $red1 = $_POST['red1']; if ($red1 == '') {$red1 = 0;} //default colour so user sees something nice if ($red1 > 255) {$red1 = 255;} if ($red1 < 0) {$red1 = 0;} $green1 = $_POST['green1']; if ($green1 == '') {$green1 = 0;} if ($green1 > 255) {$green1 = 255;} if ($green1 < 0) {$green1 = 0;} $blue1 = $_POST['blue1']; if ($blue1 == '') {$blue1 = 64;} if ($blue1 > 255) {$blue1 = 255;} if ($blue1 < 0) {$blue1 = 0;} $red2 = $_POST['red2']; if ($red2 == '') {$red2 = 80;} if ($red2 > 255) {$red2 = 255;} if ($red2 < 0) {$red2 = 0;} $green2 = $_POST['green2']; if ($green2 == '') {$green2 = 200;} if ($green2 > 255) {$green2 = 0;} if ($green2 < 0) {$green2 = 0;} $blue2 = $_POST['blue2']; if ($blue2 == '') {$blue2 = 255;} if ($blue2 > 255) {$blue2 = 255;} if ($blue2 < 0) {$blue2 = 0;} $invert = $_POST['invert']; if ($invert == 'on') { $red1 = 255-$red1; $green1 = 255-$green1; $blue1 = 255-$blue1; $red2 = 255-$red2; $green2 = 255-$green2; $blue2 = 255-$blue2; } } else { srand((double)microtime()*1000000); $red1 = rand(0,255); $red2 = rand(0,255); $green1 = rand(0,255); $green2 = rand(0,255); $blue1 = rand(0,255); $blue2 = rand(0,255); } //preserve originals $red0 = $red1; $green0 = $green1; $blue0 = $blue1; $red = $red2; $green = $green2; $blue = $blue2; echo << * { font-family:'Times New Roman',Times,serif; font-size:16px; } html, body { margin:0; padding:0; background-color:#fff; } div { position:relative; top:0; height:1px; } #formdiv { position:absolute; top:20px; left:542px; width:auto; height:auto; } #red1, #red2, #green1, #green2, #blue1, #blue2 {width:50px;} #go {width:auto;} #invert, #random {margin-left:5px; margin-right:15px;} form {padding:0;} legend, fieldset { border-top:3px solid #ddd; border-right:3px solid #999; border-bottom:3px solid #777; border-left:3px solid #bbb; background-color:#eee; } legend { font-weight:bold; padding:2px 5px 2px 5px; } fieldset { display:inline; padding:10px; text-align:center; } label {font-size:80%; margin:0; padding:0;} label[for='red1'], label[for='red2'] {color:#c00; margin-left:10px;} label[for='green1'], label[for='green2'] {color:#090;} label[for='blue1'], label[for='blue2'] {color:#00c;} #dates {font-size:90%;} .right {text-align:right; height:auto;} HTML; $red_dif0 = ($red1 - $red2); if ($red_dif0 > -1) {// result not negative $math_red0 = -1; $step_red0 = $red_dif0/255; } if ($red_dif0 < 0) {// result negative $red_dif0 = ($red2 - $red1); $math_red0 = 1; $step_red0 = $red_dif0/255; } $green_dif0 = ($green1 - $green2); if ($green_dif0 > -1) { $math_green0 = -1; $step_green0 = $green_dif0/255; } if ($green_dif0 < 0) { $green_dif0 = ($green2 - $green1); $math_green0 = 1; $step_green0 = $green_dif0/255; } $blue_dif0 = ($blue1 - $blue2); if ($blue_dif0 > -1) { $math_blue0 = -1; $step_blue0 = $blue_dif0/255; } if ($blue_dif0 < 0) { $blue_dif0 = ($blue2 - $blue1); $math_blue0 = 1; $step_blue0 = $blue_dif0/255; } $red_dif = ($red1 - $red2); if ($red_dif > -1) {// result not negative $math_red = -1; $step_red = $red_dif/255; } if ($red_dif < 0) {// result negative $red_dif = ($red2 - $red1); $math_red = 1; $step_red = $red_dif/255; } $green_dif = ($green1 - $green2); if ($green_dif > -1) { $math_green = -1; $step_green = $green_dif/255; } if ($green_dif < 0) { $green_dif = ($green2 - $green1); $math_green = 1; $step_green = $green_dif/255; } $blue_dif = ($blue1 - $blue2); if ($blue_dif > -1) { $math_blue = -1; $step_blue = $blue_dif/255; } if ($blue_dif < 0) { $blue_dif = ($blue2 - $blue1); $math_blue = 1; @$step_blue = $blue_dif/255; } $left = 256; //left $width = 1; //width for ($h = 1; $h < 257; $h += 1, $width += 2, $left -=1) { //round values for CSS $red_round0 = round($red0,0); $green_round0 = round($green0,0); $blue_round0 = round($blue0,0); echo << '; for ($j = 1; $j < 513; $j += 1) { echo << HTML; } $datemod = date("j F Y", getlastmod()); echo << HTML; ?>