Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 31.03.2012, 21:39
Интересующийся
Отправить личное сообщение для Smokvin Посмотреть профиль Найти все сообщения от Smokvin
 
Регистрация: 31.03.2012
Сообщений: 20

Смена стиля при клике
Уважаемые, помогите, пожалуйста, решением проблемы.
Есть следующий код:

<script type="text/javascript">
    function spoiler(id) {
        if(document.getElementById(id).style.display == "none"){
            document.getElementById(id).style.display = "";
 
        } else {
            document.getElementById(id).style.display = "none";
        }
    }
</script>
 

<div class="color1" onclick="javascript:spoiler('spoil1')">Открыть спойлер</div>
<div id="spoil1" style="display: none;">Скрытый текст</div>


Как Вы можете видеть, он открывает скрытый DIV с ID "sploil1". Необходимо доработать этот скрипт то того, чтобы при этом происходила также замена класс "color1" на "color2" (и обратно при повторном клике).

На всякий случай ещё раз:
1. Кликаем: открывается скрытый DIV, основной DIV меняет класс на "color2"
2. Кликаем повторно: спойлерный DIV обратно скрывается, а основной DIV меняет класс обратно с "color2" на "color1"

Заранее благодарю за помощь.
С меня плюс в карму.
Ответить с цитированием
  #2 (permalink)  
Старый 31.03.2012, 22:15
Интересующийся
Отправить личное сообщение для Smokvin Посмотреть профиль Найти все сообщения от Smokvin
 
Регистрация: 31.03.2012
Сообщений: 20

Нашёл решение:

<script type="text/javascript">
    function spoiler(id) {
        if   (  document.getElementById(id).style.display == "none" )
             {  document.getElementById(id).style.display = "";   } 
        else {  document.getElementById(id).style.display = "none"; }
                         }
</script>
 

<script>
function toggleClass(el, class1, class2) {
    el.className = (el.className == class1) ? class2 : class1; } </script>



<div class="color1" onclick="spoiler('spoil1'); toggleClass(this, 'color1', 'color2')">Открыть спойлер</div>
<div id="spoil1" style="display: none;">Скрытый текст</div>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
При клике в любом месте документа должен удаляться определенный id DorianLeroy jQuery 2 24.12.2011 22:05
Изменение стиля родительского элемента при :hover дочернего lanzs Элементы интерфейса 2 16.10.2010 13:28
menu с выпадающими подменю при наведении и раздвижное при клике bugor Элементы интерфейса 3 04.10.2010 14:32
Смена картинки (бекграунд дива ) при событии (нажатие клавиш или клавиши и мыши) Monster Events/DOM/Window 5 01.11.2009 01:16
Смена id при клике Nestor Общие вопросы Javascript 6 04.03.2009 19:10