14:17 21.08.2018
Доброго времени суток! Пытаюсь сделать скрипт для проведения опроса, задан вопрос и дано 4 варианта ответа, надо выбрать один, кликнув на нужный вариант. Блок с ответом, на который кликнут должен выделиться, должен измениться фон, пусть будет оранжевый. У меня такие блоки:
И у них такой стиль:
Как можно сделать?
И ещё вопрос, сейчас блоки выстраиваются один под другим, как можно выстроить их в одну строчку?
Спасибо.
<div class="answer">Блок 1</div>
<div class="answer">Блок 2</div>
<div class="answer">Блок 3</div>
<div class="answer">Блок 4</div>
И у них такой стиль:
.answer {
border: 1px solid #000000;
height: 100px;
width: 100px;
}
Как можно сделать?
И ещё вопрос, сейчас блоки выстраиваются один под другим, как можно выстроить их в одну строчку?
Спасибо.
- Жалоба
15:32 21.08.2018
Попробуйте код. Цвет фона:
Чтобы выравнить блоки в одну линию добавьте свойство
#ffa500
(оранжевый).var answer = document.getElementsByClassName('answer');
var cnt = answer.length;
for (var i = 0; i < cnt; i++) {
answer[i].onclick = function() {
for (var j = 0; j < cnt; j++) {
answer[j].style.backgroundColor = '';
};
this.style.backgroundColor = '#ffa500';
};
};
Чтобы выравнить блоки в одну линию добавьте свойство
display: inline-block
стиля:.answer {
border: 1px solid #000000;
display: inline-block;
height: 100px;
width: 100px;
}