Как включить непрозрачность элементов с помощью JavaScript

Question

У меня есть div, который имеет 14 дочерних div с некоторым содержанием.Теперь мне нужно, чтобы при загрузке он отображал все 14 делителей с непрозрачностью = 1, но когда я наведу курсор мыши на один из них, непрозрачность других должна уменьшиться на 50%.Только текущий должен иметь полную непрозрачность.Точно так же, когда я наведу указатель мыши на другой div сейчас, тогда, за исключением текущего, непрозрачность других div'ов должна быть уменьшена на 50%.

Как я могу сделать это с помощью JavaScript, и я не хочу использовать какие-либобиблиотека (jquery).

Обновление: все заработало!:)

/*onmouseover*/
function showCurrentDimOthers(el) {
        var otherElements = document.getElementById("see_all_content_holder").childNodes;
        for (var o = 0; o < otherElements.length; o++) {
            otherElements[o].style.opacity = 0.5;
            otherElements[o].style.filter = 'alpha(opacity=5)';
        }

        el.style.opacity = 1.0;
        el.style.filter = 'alpha(opacity=10)';
    }

/*onmouseout*/
function dimCurrent(el) {
        el.style.opacity = 0.5;
        el.style.filter = 'alpha(opacity=5)';

    }

Answer 1

Почему так сложно?Из того, что я вижу, CSS достаточно для этого:

<ul>
    <li>A</li>
    <li>B</li>
    <li>C</li>
    <li>D</li>
    <li>E</li>
</ul>

ul:hover li {
  opacity: 0.5;
}

ul li:hover {
  opacity: 1;
}

http://jsfiddle.net/fkAyb/

Answer 2

Вы можете изменить прозрачность следующим образом:

document.getElementById('someid').style.opacity = '0.5';

Используйте события onmouseover и onmouseout для остальных.

Answer 3

Идея, которую я не пробовал:

1. Дайте каждому div идентификатор, например, "div-1", "div-2"
2. Сохраните их все вarray.
3. Прослушивание события onmouseover, цикл в массиве и изменение непрозрачности всех элементов массива, которые отличаются от текущего идентификатора.
4. Прослушивание события onmouseout и отменанепрозрачность до 1.

Если это не достаточно ясно, дайте мне знать.