Ширина блоков из списка
Уважаемые коллеги, доброго времени суток.
Суть вопроса такова: есть разметка - <ul> <li></li> <li></li> <li></li> <li></li> </ul> далее есть код JS:
/*объект значений ширины*/
var wid = {
one: {
value: 150
},
two: {
value: 100
},
three: {
value:50
},
four: {
value:400
}
}
/* список элементов*/
var elems = document.querySelectorAll('ul li');
/*Далее необходимо задать всем li из списка ширину - значения в объекте wid*/
Вопрос. Как это сделать в цикле???? Помгите плиз. заранее спасибо |
Цитата:
|
// for (var s in components){
// var percent = Math.round((components[s].value*100)/components[s].parent);
// for (var i =0;i < spans.length;i++) {
// spans[i].setAttribute('style', 'width:' + percent + '%');
// }
// }
|
for (var s in components){
var percent = Math.round((components[s].value*100)/components[s].parent);
for (var i =0;i < spans.length;i++) {
spans[i].setAttribute('style', 'width:' + percent + '%');
}
}
|
вот так не работает((((
|
вернее вот так правильно
for (var s in wid){
var percent = Math.round((wid[s].value*100)/40);
for (var i =0;i < elems.length;i++) {
elems[i].setAttribute('style', 'width:' + percent + '%');
}
}
|
Роман Андреевич, делай сразу полный пример. Огрызки никому не нужны.
|
Цитата:
|
Цитата:
elems[i].style.width=percent + '%'; |
Полный пример:
/*объект значений ширины*/
var wid = {
one: {
value: 150
},
two: {
value: 100
},
three: {
value:50
},
four: {
value:400
}
}
var elems = document.querySelectorAll('ul li');
/*перебираем ключи у объекта ширин*/
for (var s in wid){
var percent = Math.round(wid[s].value/100));
}
/*добавляем каждому li свою ширину из объекта*/
for (var i =0;i < elems.length;i++) {
elems[i].setAttribute('style', 'width:' + percent + '%');
}
В итоге он всем выдает 50% |
| Часовой пояс GMT +3, время: 03:33. |