Использование цвета давно опробованный и важный элемент в представлении данных для пользовательского интерфейса. Несмотря на то, является ли это отрицательным балансом или указанием успешного процесса, цвет поможет передать ваше сообщение намного более эффективно, чем простой черно-белый текст.

Josh Nathanson представил интересный jQuery плагин HeatColor, который изменяет цвета элементов согласно их значениям.

Пример кода:

$(\"#ex1\").tablesorter();
	
function sortwithcolor( column ) {
	$(\"#ex1 > tbody > tr\").heatcolor(
		function() { return $(\"td:nth-child(\" + column + \")\", this).text(); }
	);
};
	
$(\"th\").click(function() {
	$(this).siblings().css(\"background-color\",\"#cccccc\").end().css(\"background-color\",\"#dd0000\");
	sortwithcolor( $(this).parent().children().index( this ) + 1 );
});
	
sortwithcolor(8);

Результат:

Другие интересные демки.

Популярность: 38%