Генератор градиентов и оттенков для Blogger
Если инструмент понравится и будет востребован и полезен гостям сайта, то посещать ваш ресурс они будут чаще, что даёт огромный плюс для вашего сайта.
Сегодня предлагают посмотреть скрипт генератора градиента и оттенков цвета. Он поможет подобрать посетителю вашего блога цвета для градиента.
Пользователю нужно в окошко вставить код цвета формата #ffffff или ffffff, без #.
Во второе окно - любое цифровое значение.
Нажать на кнопку "Результат".
Кроме этого, в цветной полосе можно подбирать оттенки цвета, кликнуть на понравившийся
оттенок и скопировать его код, расположенный рядом с кнопкой "Результат".
Выглядит генератор так:
Код генератора
<div style="width: 400px;">
<form>
<p>
Оригинальный цвет: <input type="text" name="orig" value="339990"><br>
Масштабный фактор: <input type="text" name="scalef" value="4"><br>
<input type="button" value="Нажать" onclick="showrainbow(this.form)">
<input type="text" readonly name="outp" style="border: none;">
</p>
</form>
<table width="150">
<tr>
<td width="50%" height="50" id="origcolor">Original</td>
<td width="50%" id="newcolor">New</td></tr>
</table>
<table cellpadding="0" cellspacing="0">
<tr>
<script type="text/javascript">
for (i=0; i<256; i++)
document.write('<td width="10" height="50" id="colorcell', i, '" onclick="document.forms[0].outp.value = this.nhexvalue"></td>');
</script>
</tr>
</table>
</div>
<script type="text/javascript">
function colorscale(hexstr, scalefactor) {
var r = scalefactor;
var a, i;
if (r < 0 || typeof(hexstr) != 'string')
return hexstr;
hexstr = hexstr.replace(/[^0-9a-f]+/ig, '');
if (hexstr.length == 3) {
a = hexstr.split('');
} else if (hexstr.length == 6) {
a = hexstr.match(/(\w{2})/g);
} else
return hexstr;
for (i=0; i<a.length; i++) {
if (a[i].length == 2)
a[i] = parseInt(a[i], 16);
else {
a[i] = parseInt(a[i], 16);
a[i] = a[i]*16 + a[i];
}
}
var maxColor = parseInt('ff', 16);
function relsize(a) {
if (a == maxColor)
return Infinity;
return a/(maxColor-a);
}
function relsizeinv(y) {
if (y == Infinity)
return maxColor;
return maxColor*y/(1+y);
}
for (i=0; i<a.length; i++) {
a[i] = relsizeinv(relsize(a[i])*r);
a[i] = Math.floor(a[i]).toString(16);
if (a[i].length == 1)
a[i] = '0' + a[i];
}
return a.join('');
}
function showrainbow(f) {
var colorcell, hex, i, nhex;
hex = f.orig.value;
hex = hex.replace(/\W/g, '');
nhex = colorscale(hex, f.scalef.value-0);
if (nhex != hex) {
f.outp.value = nhex;
colorcell = document.getElementById('origcolor');
i = document.getElementById('newcolor');
colorcell.style.background = '#' + hex;
i.style.background = '#' + nhex;
for (i=0; i<256; i++) {
colorcell = document.getElementById('colorcell'+i);
nhex = colorscale(hex, i/(256-i));
colorcell.style.background = '#' + nhex;
colorcell.nhexvalue = nhex;
}
}
}
</script>
В коде можно поменять текст на свой, выделила его красным цветом.
Комментарии со спамом удаляются.