Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Создание разноцветного списка (https://javascript.ru/forum/dom-window/32189-sozdanie-raznocvetnogo-spiska.html)

Серджио 06.10.2012 16:48

Создание разноцветного списка
 
Я новичок! Подскажите как на javascript создать список элементы которого имеют разный цвет фона?

bes 06.10.2012 23:56

задать им разный цвет фона

Серджио 07.10.2012 00:35

задан массив RGB- кодов цветов. Требуется создать список, каждый элемент которого закрашивается соответствующим цветом из этого массива. (1элемент - 1цветом, 2элемент - 2м и т.д.)

bes 07.10.2012 00:39

ну в цикле и задать li[i].style.background = mas[i]

Серджио 07.10.2012 21:16

<script type="text/javascript">
function go() {
var arr = ["Samantha","Daisy","Lady","Oreo","Fluffy","Pepper" ,"Kitty","Misty","Duke","Sam","Simba","Sophie","Lu cky","Bella",
"Shadow","Charlie","Molly","Lucy","Boots","Taz","C hloe","Jake","Baby","Patch","Cody","Rocky","Abby", "Sassy","Casey","Coco",
"Brandy","Sandy","Harley","Spike","Max","Sasha","K atie","Sunny","Oliver","Tigger","Maggie","Missy"," Smokey","Sadie","Bailey",
"Tiger","Midnight","Bear","Buster","Murphy","Dakot a","Buddy","Sammy","Oscar","Princess","Bandit","To by","Precious","Ginger",
"Gizmo","Angel","Annie","Jack","Rusty"];
var clr = ["564785","A65999","855E47","674785","ACB1D2","4749 85","B9D2AC","5994A6","478549","8FA659","B77AB8"," 5E59A6",
"B2ACD2","47857C","B87AA8","A65984","B88B7A","8547 4D","597FA6","B8AD7A","65A659","9E59A6","788547"," 47856B","47855A",
"856F47","A6596E","A66759","C4D2AC","A69259","7AA6 59","477C85","A67D59","858047","7359A6","A67AB8"," ACD2CA","BDACD2",
"CED2AC","678547","ACD2BF","475A85","59A663","AED2 AC","59A68D","ACBBD2","A5A659","568547","85475E"," 59A678","784785",
"59A6A2","ACD2B4","476B85","B87A97","ACC6D2","B89C 7A","596AA6","854D47","ACD1D2","8859A6","85476F"," 854780","B87A86"];
var count = arr.length;
var oc=document.getElementById('container');
var os=document.createElement('select');
os.size=30;
os.name="Item";


var i,op;
for (i=0; i<count; i++) {

op = document.createElement('option');



op.innerHTML=arr[i];
os.appendChild(op);


};
oc.appendChild(os);
//alert(oc.innerHTML);
};
//-->

</script>

А вот в таком варианте не срабатывает почему то? Когда задаю цвет из массива.

bes 07.10.2012 21:19

[html run]
http://javascript.ru/formatting

lord2kim 07.10.2012 22:02

Серджио, вы нигде не задаете цвет из массива...только текст элементов списка
<script type="text/javascript">
function go() {
	var arr = ["Samantha","Daisy","Lady","Oreo","Fluffy","Pepper" ,"Kitty","Misty","Duke","Sam","Simba","Sophie","Lu cky","Bella",
	"Shadow","Charlie","Molly","Lucy","Boots","Taz","C hloe","Jake","Baby","Patch","Cody","Rocky","Abby", "Sassy","Casey","Coco",
	"Brandy","Sandy","Harley","Spike","Max","Sasha","K atie","Sunny","Oliver","Tigger","Maggie","Missy"," Smokey","Sadie","Bailey",
	"Tiger","Midnight","Bear","Buster","Murphy","Dakot a","Buddy","Sammy","Oscar","Princess","Bandit","To by","Precious","Ginger",
	"Gizmo","Angel","Annie","Jack","Rusty"];
	var clr = ["564785","A65999","855E47","674785","ACB1D2","474985","B9D2AC","5994A6","478549","8FA659","B77AB8","5E59A6",
	"B2ACD2","47857C","B87AA8","A65984","B88B7A","85474D","597FA6","B8AD7A","65A659","9E59A6","788547","47856B","47855A",
	"856F47","A6596E","A66759","C4D2AC","A69259","7AA659","477C85","A67D59","858047","7359A6","A67AB8","ACD2CA","BDACD2",
	"CED2AC","678547","ACD2BF","475A85","59A663","AED2AC","59A68D","ACBBD2","A5A659","568547","85475E","59A678","784785",
	"59A6A2","ACD2B4","476B85","B87A97","ACC6D2","B89C7A","596AA6","854D47","ACD1D2","8859A6","85476F","854780","B87A86"];
	var count = arr.length, oc = document.getElementById('container'), os = document.createElement('select');
	os.size=30;
	os.name="Item";
	var op;
	for (i=0; i<count; i++) {
		op = document.createElement('option');
		op.style.backgroundColor = "#"+clr[i];
		op.innerHTML = arr[i];
		os.appendChild(op);
	}
	oc.appendChild(os);
}
</script>
<div id="container"></div><input type="button" onClick="go()" value="click">

Серджио 08.10.2012 00:46

Спасибо большое всем!!!


Часовой пояс GMT +3, время: 07:39.