Главная » 2010 » Сентябрь » 3 » Боьшой выбор цвет фона сайта (Javascript)
03.09.2010, 07:31

Боьшой выбор цвет фона сайта



Расширенная таблица цветов для установления цвета фона на сайте. Просто подведите курсор к нужному цвету и фон автоматически измениться.

В head необходимо вставить эти скрипты:

Code
<SCRIPT LANGUAGE="JavaScript">

<!--//Heres the code for the RGB in paint.
function rgb(x)
  {
  var value=0;
  var value_array=new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f");
  var first=x.charAt(0);
  var second=x.charAt(1);
  var a=0;
  var b=0;
  while (value_array[value]!=first)
  {
  value++;
  a=a+16;
  }
  value="0";
  while (value_array[value]!=second)
  {
  value++;
  b++;
  }
  x=a+b;
  return x;
  }
// end RGB in paint-->
</script>

<SCRIPT LANGUAGE="JavaScript">
<!-- Heres the code to type in you own Hexadecimal value
function changeBack()
  {
  var hex=window.document.f.c.value;
  document.bgColor=hex;
  var hex1=hex.charAt(0);
  if (hex1!="#")
  {
  hex=document.bgColor;
  }
  var red=hex.substring (1,3);
  var rdd=rgb(red);
  document.bb.re.value=rdd;
  var green=hex.substring (3,5);
  var grn=rgb(green);
  document.cc.gr.value=grn;
  var blue=hex.substring (5,7);
  var blue1=rgb(blue);
  document.dd.bl.value=blue1;
  }
// End own Hexadecimal-->
</script>

<SCRIPT LANGUAGE="JavaScript">
<!--Here\'s the code to type in your own RGB
  function changeBackRGB()
  {
  var red=window.document.bb.re.value;
  var green=window.document.cc.gr.value;
  var blue=window.document.dd.bl.value;
  red1=rgb_hex(red);
  green1=rgb_hex(green);
  blue1=rgb_hex(blue);
  var hex="#"+red1+green1+blue1;
  document.bgColor=hex;
  document.f.c.value=hex;
  }
// End your own RGB-->

//<!-- Change from RGB to hexadecimal
function rgb_hex(colour)
{
  var rgb_array=new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f");
if (colour==0)
  {
  var colour="00";
  return colour;
  }
else
  {
  var y=colour/16;
  var y=y+"a";
  if (y.indexOf(".")==-1)
  {
  var hex2="0";
  var u=y.indexOf("a");
  var q=y.substring(0,u);
  var hex1=rgb_array[q];
  }
  else
  {
  var l=y.split(".");
  var q=l[0];
  var z=q*16;
  var xyz=colour-z;
  var hex1=rgb_array[q];
  var hex2=rgb_array[xyz];
  }
  var colour=hex1+hex2;
  return colour;
  }
}
// end-->
</script>

<SCRIPT LANGUAGE="JavaScript">
<!--Here\'s the background changer for the cube
leftclick=0;

function r(hval)
  {
  if (leftclick==0)
  {
  document.bgColor=hval;
  document.f.c.value=hval;
  var red=hval.substring (1,3);
  var rdd=rgb(red);
  document.bb.re.value=rdd;
  var green=hval.substring (3,5);
  var grn=rgb(green);
  document.cc.gr.value=grn;
  var blue=hval.substring (5,7);
  var blue1=rgb(blue);
  document.dd.bl.value=blue1;
  document.colour1.colour2.value="";
  }
  }
//end changer
//Heres the lock button
function lock()
  {
  if (leftclick==0)
  {
  leftclick=1;
  }
  else
  {
  leftclick=0;
  }
  }
//end lock-->
</script>

<SCRIPT LANGUAGE="JavaScript">
<!-- Reverse Lookup Color
function changeColor()
{
var clr=window.document.colour1.colour2.value;
document.f.c.value=clr;
var clr=changeBack();
var clr=changeBackRGB();
}
// End Reverse Lookup Color-->
</script>

А в body добавляем это:

Code
<p>
<center>
<h3>Color Cube</H3></center>
<center>Click on a color to lock it.<br>Click on any square to unlock.</center>
<center>
<table>

<SCRIPT LANGUAGE="JavaScript">
<!-- Cube Maker
var hex_Red=new Array("00","33","66","99","cc","ff");
var hex_Green=new Array("00","33","66","99","cc","ff");
var hex_Blue=new Array("00","33","66","99","cc","ff");
var hexred="00";
var hexgreen="00";
var hexblue="00";
var red=0;
var green=0;
var blue=0;
var x=0;
var y=0;
var z=0;
var xyz=0;

while (y<6)
  {
  window.document.write("<tr>");
  var x=0;
  var hexblue=hex_Blue[blue];
  while (x<6)
  {
  var z=0;
  var hexgreen=hex_Green[green];
  while (z<6)
  {
  var hexred=hex_Red[red];
  var hexadecimal="#"+hexred+hexgreen+hexblue;
  window.document.write("<td bgColor="+hexadecimal+"><a href=\"javascript:lock()\" onmouseover=\"r(\'"+hexadecimal+"\'); return true\"><img src=\"\" border=\"0\" height=\"20\" width=\"20\"/></a></td>");
  z++;
  red++;
  if (red==6)
  {
  red=0;
  }
  }
  x++;
  green++;
  if (green==6)
  {
  green=0;
  }
  xyz++;
  if (xyz==3)
  {
  window.document.write("</tr>");
  xyz=0;
  }
  }
  y++;
  blue++
  if (blue==6)
  {
  blue=0;
  }
  }
// End color cube. -->
</script>

</table>
</center>

<center><form name="f" onSubmit="changeBack(); return false;"><input type="text" name="c" size="7"></form></center>

<center>Here's the color code to match up the RGB in paint.</center>
<table align="center">
  <tr>
  <td align="center" width="100">Red</td>
  <td align="center" width="100">Green</td>
  <td align="center" width="100">Blue</td>
  </tr>
  <tr>
  <td align="center"><form name="bb" onSubmit="changeBackRGB(); return false;"><input type="text" name="re" size="2"></form></td>
  <td align="center"><form name="cc" onSubmit="changeBackRGB(); return false;"><input type="text" name="gr" size="2"></form></td>
  <td align="center"><form name="dd" onSubmit="changeBackRGB(); return false;"><input type="text" name="bl" size="2"></form></td>
  </tr>
</table>

<center>
<table>

<tr><td align="center"><form><input type="button" value="Reverse Lookup - Hexadecimal" size="10" onClick="changeBack(); return false;"></form></td>
<td align="center"><form><input type="button" value="Reverse Lookup - RGB" size="10" onClick="changeBackRGB(); return false;" ></form></td></tr>

<tr><td align="center" colspan="2"><form><input type="button" value="Reverse Lookup - Color (ex. Red, Green...)" size="15" onClick="changeColor()"; return false;"></form></td></tr>

<tr><td align="center" colspan="2"><form name="colour1" onSubmit="changeColor(); return false;"><input type="text" name="colour2" size="7"></form></td></tr>

</table>
</center>
</p>
Материал взят с сайта infoscript.ru
Внимание! Копирование данного материала запрещено без указания ссылки на сайт Infoscript.ru
Источник/Автор: Неизвестен
Категория: JavaScript's | Просмотров: 3925 | Добавил: antisept | Рейтинг: 3.0/1 |
Теги: выбор, Боьшой, цвет, фона, сайта
Пока комментариев нет. Ты можешь быть первым!
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]