Чат сообщества
|
   |
| Модератор форума: JonMagon |
| Сообщество uCoz Вебмастеру JavaScript, Flash и прочие технологии Нужна помощь со скриптом спойлера. (Скрипт почти готов, но выдает ошибку, не могу понять почему.) |
| Нужна помощь со скриптом спойлера. |
|
Подскажите, люди добрые, в чем может быть проблема.
Имеется страница, на которой два текста, один под спойлером спрятан, второй нет, есть кнопка у первого с надписью "читать еще", по нажатию спойлер скрытого текста открывается, а второй текст, что был открыт, скрывается. Но вот незадача, вместе эти две функции по нажатию одной кнопки не хотят работать, - только по отдельности. Чего только не пробывал... Задумка этого решения такова: чтобы не рвалась страница, при желании открыть спойлер, нижний блок скрывается, а спойлер с новым блоком открывается, и все красиво и эстетично. Вот код: Код <script language="javascript"> function toggle() { var ele = document.getElementById("toggleText"); var text = document.getElementById("displayText"); var ele = document.getElementById("toggleText2"); var text = document.getElementById("hideText"); if(ele.style.display == "block") { ele.style.display = "none"; text.innerHTML = "Еще"; } else { ele.style.display = "block"; text.innerHTML = "Закрыть"; } } </script> Мы такие-то такие, но если нужно больше информации, то <div id="toggleText" style="display: none;"> А вот тут о нас поподробнее.... бла-бла-бла и бла-бла-бла </div><a href="javascript:toggle();" id="displayText" id="hideText">еще</a></div><br> <div id="toggleText2" style="display: yes;"> Обращайтесь к нам. мы поможем. Мы умеем то-то и т.д. </div> Добавлено (12 Ноя 2013, 18:03:23) --------------------------------------------- Нашел решение, которое стало выполнять основную нужную мне функцию, но пропала возможность смены надписи "Еще" на "Закрыть" и обратно... может кто может прикрутить этот функционал...? Пробывал с предыдущим скриптом по аналогии - не получается... Код <script> show.visible = '2';show.hidden = '3'; function show(){ show.hidden = show.visible; show.visible = (show.visible === '2')?'3':'2'; document.getElementById(show.visible).style.display = 'block'; document.getElementById(show.hidden).style.display = 'none';} </script> <a href="#" onClick="show();">показать/скрыть</a> <div id="2" style="display:block"> Скрытый текст1 </div> <div id="3" style="display:none"> Скрытый текст2 </div> Сообщение отредактировал Zoylander - Вторник, 12 Ноя 2013, 22:51:09
|
|
|
|
Цитата JacksonMihailov (  )попробуй jquery Код есть, даже два варианта (выше) - нужно лишь только чуть-чуть подправить. |
|
|
|
Код <script type="text/javascript"> function openbox(id){ display = document.getElementById('box').style.display; // записываем в переменную состояние блока box if(display=='none'){ // если состояние блока box - "скрыт" document.getElementById('box').style.display='block'; // меняем это состояние на - отображать document.getElementById('box2').style.display='none'; // заодно скрываем другой блок toggler.innerHTML = 'Закрыть'; // и меняем надпись }else{ // если же состояние box было - "не скрыт" document.getElementById('box').style.display='none'; // скрываем его document.getElementById('box2').style.display='block'; // другой блок - показываем toggler.innerHTML = Открыть'; // и меняем надпись } } </script> // Конец)) Код <a href="#" id="toggler" onclick="openbox('box'); return false">Открыть</a> Код <div id="box2">Текст1</div> <div id="box" style="display: none;">Текст2</div> Сообщение отредактировал Solaris(Olga) - Среда, 13 Ноя 2013, 00:29:36
|
|
Цитата JacksonMihailov ( )поищи тогда тоже jquery .fadeIn() .fadeOut() Спасибо за советы! Solaris(Olga), то, что нужно!!! Огромное спасибо!!! Скрипт прекрасно стал. Результат можно увидеть у меня на главной странице www.hotel-minsk.by/. В коде нашел маленькую ошибку... между тегами <script> Цитата Solaris(Olga) ( )toggler.innerHTML = Открыть'; // и меняем надпись 'Открыть' Еще раз огромное спасибо!!!! |
| |||
| |||
Будьте в курсе всех обновлений: подпишитесь на наш официальный Telegram-канал uCoz и задавайте вопросы в чате сообщества!