Форум

trikadin · #1 (**permalink**) 27.05.2010, 18:00

Надо написать код, который выводил бы таблицу безопасных цветов на экран. Подумал, написал вот это

draw.createPalette=function(){
	for(var r=0; r<=255; r+=51){
		pNode=document.createElement("table");
		pNode.className="palette";
		document.body.appendChild(pNode);
		for(var g=0; g<=255; g+=51){
			var pTr=document.createElement("tr");
			pNode.appendChild(pTr);
			for(var b=0; b<=255; b+=51){
				var pTd=document.createElement("td");
				pTd.onclick=function(color){return function(){draw.color=color}}(pTd.style.background="#"+r.toString(16)+g.toString(16)+b.toString(16));
				pTr.appendChild(pTd);
			}
		}	
	}
}

Работает только в файерфоксе, и то лишь частично (не все цвета появляются). Тогда я написал так:

draw.createPalette=function(){
	for(var r=0; r<=255; r+=51){
		pNode=document.createElement("table");
		pNode.className="palette";
		document.body.appendChild(pNode);
		for(var g=0; g<=255; g+=51){
			var pTr=document.createElement("tr");
			pNode.appendChild(pTr);
			for(var b=0; b<=255; b+=51){
				var pTd=document.createElement("td");
				pTd.onclick=function(color){return function(){draw.color=color}}(pTd.style.background="rgb("+r+","+g+","+b+")");
				pTr.appendChild(pTd);
			}
		}	
	}
}

Ура! Заработало, но вот сюрприз: IE6 наотрез отказался выводить её на экран. Почему? Вроде смотрел, ни слова про то, что IE6 rgb не поддерживает. В чём фишка?

P.S. Кстати, почему первый код не работает?
P.P.S. Забыл дописать: при клике на каждую ячейку переменной draw.color присваивается значение фона данной ячейки.

e1f · #2 (**permalink**) 27.05.2010, 19:05

Как минимум потому, что "0" != "00":

<style type="text/css">
.palette td {
    width: 1em;
    height: 1em;
}
</style>
<script type="text/javascript">
<!--
function _init() {
    var pNode = document.createElement("TABLE");
    pNode.className = "palette";
    for (var r=0; r<=255; r+=51) {
        for(var g=0; g<=255; g+=51){
            var pTr = document.createElement("TR");
            for(var b=0; b<=255; b+=51) {
                var pTd = document.createElement("TD"),
                    color = "#" +
                        (r ? r.toString(16) : '00') +
                        (g ? g.toString(16) : '00') +
                        (b ? b.toString(16) : '00');

                pTd.onclick = function(color){
                    return function(){
                        draw.color=color
                    }
                }(pTd.style.backgroundColor = color);

                pTr.appendChild(pTd);
            }
            pNode.appendChild(pTr);
        }   
    }
    document.body.appendChild(pNode);
}
-->
</script>
<body onload="_init()"></body>

trikadin · #3 (**permalink**) 27.05.2010, 20:13

Спасибо. Проблему первого кода решили. В голову не пришло))

Однако эксплорер всё равно не показывает эти таблицы.

Форум

Справочник

Discord чат

Курсы javascript