Разворачивающаяся страница как сделать

Разворачивающаяся страница как сделать
Разворачивающаяся страница как сделать
Разворачивающаяся страница как сделать

#1 GSA0089

Отправлено

Как сделать такой разворачивающийся текст? Прикрепленные изображения Безымянный.png
#2 ne_yana

Отправлено

Просмотр сообщенияGSA0089 (08 Октябрь 2013 - 10:45) писал:

Как сделать такой разворачивающийся текст?


Добрый день, например, если в хотите добавить выпадающий текст на главной странице, то зайдите в админке в раздел Сайт - Страницы, найдите там главную страницу и нажмите "перейти к странице редактирования". На панели редактора нажмите Источник, заключите желаемой слово или фразу в следующий тег:
<a href="javascript:sh()">Подробнее...</a></p> <div id="info" style="padding-top:15px;">ЗДЕСЬ ПИШЕМ ИЛИ ВСТАВЛЯЕМ ТЕКСТ, КОТОРЫЙ ДОЛЖЕН БЫТЬ ПО УМОЛЧАНИЮ СКРЫТЫМ И ПОКАЗЫВАТЬСЯ (РАСКРЫВАТЬСЯ) ТОЛЬКО ПРИ КЛИКЕ НА ССЫЛКУ &quot;ПОДРОБНЕЕ&quot;, СО ВСЕМИ НУЖНЫМИ ТЕГАМИ.</div> <script type="text/javascript"> sh(); function sh() { obj = document.getElementById("info"); if( obj.style.display == "none" ) { obj.style.display = "block"; } else { obj.style.display = "none"; } } </script>
#3 GSA0089

Отправлено

Просмотр сообщенияne_yana (08 Октябрь 2013 - 10:54) писал:

Добрый день, например, если в хотите добавить выпадающий текст на главной странице, то зайдите в админке в раздел Сайт - Страницы, найдите там главную страницу и нажмите "перейти к странице редактирования". На панели редактора нажмите Источник, заключите желаемой слово или фразу в следующий тег:
<a href="javascript:sh()">Подробнее...</a></p> <div id="info" style="padding-top:15px;">ЗДЕСЬ ПИШЕМ ИЛИ ВСТАВЛЯЕМ ТЕКСТ, КОТОРЫЙ ДОЛЖЕН БЫТЬ ПО УМОЛЧАНИЮ СКРЫТЫМ И ПОКАЗЫВАТЬСЯ (РАСКРЫВАТЬСЯ) ТОЛЬКО ПРИ КЛИКЕ НА ССЫЛКУ &quot;ПОДРОБНЕЕ&quot;, СО ВСЕМИ НУЖНЫМИ ТЕГАМИ.</div> <script type="text/javascript"> sh(); function sh() { obj = document.getElementById("info"); if( obj.style.display == "none" ) { obj.style.display = "block"; } else { obj.style.display = "none"; } } </script>
Я вставил ваш вариант
Вот что вышло Прикрепленные изображения Безымянный.pngБезымянный1.png
#4 ne_yana

Отправлено

Просмотр сообщенияGSA0089 (08 Октябрь 2013 - 11:03) писал:

Я вставил ваш вариант
Вот что вышло

Нужно вставить все, начиная, с <a и заканчивая </script> , предварительно нажав на панели редактора на Источник. Прикрепленные изображения скрин.png
#5 GSA0089

Отправлено

Просмотр сообщенияne_yana (08 Октябрь 2013 - 11:10) писал:

Нужно вставить все, начиная, с <a и заканчивая </script> , предварительно нажав на панели редактора на Источник.
как сократить расстояние? Прикрепленные изображения Безымянный.png
#6 ne_yana

Отправлено

Просмотр сообщенияGSA0089 (08 Октябрь 2013 - 11:19) писал:

как сократить расстояние?

Попробуйте заменить эту строку
<div id="info" style="padding-top:15px;">
на
<div id="info" style="padding-top: 0px; margin-top: -39px;">
#7 (Рекбес)

Отправлено

Вставь вот этот код,а информацию,текст на русском напиши свою.
<!-- Блок описания вариантов оплаты --> <a onclick="$('.textHideBlock').toggle();return(false);" href="#" style="text-decoration: none;"> <h5>Мы принимаем оплату</h5></a> <div class="textHideBlock" style="display:none;"> <li>1.Qiwi</li> <li>2.PayPal</li> <li>3.Western Union</li> <li>4.Банковский перевод</li> <li>5.Пополнение на баланс телефона<br>Самый простой способ</li> </div>
#8 yashma

Отправлено

Сделала по-другому!
Вставляем в HEAD:
<script type="text/javascript">[/b] [b]/ Contractible Headers script- © Dynamic Drive (www.dynamicdrive.com) This notice must stay intact for legal use. Last updated Mar 23rd, 2004. Visit http://www.dynamicdrive.com/ for full source code /[/b] [b]var enablepersist="on" //Enable saving state of content structure using session cookies? (on/off) var collapseprevious="no" //Collapse previously open content when opening present? (yes/no)[/b] [b]if (document.getElementById){ document.write('<style type="text/css">') document.write('.switchcontent{display:none;}') document.write('</style>') }[/b] [b]function getElementbyClass(classname){ ccollect=new Array() var inc=0 var alltags=document.all? document.all : document.getElementsByTagName("") for (i=0; i<alltags.length; i++){ if (alltags[i].className==classname) ccollect[inc++]=alltags[i] } }[/b] [b]function contractcontent(omit){ var inc=0 while (ccollect[inc]){ if (ccollect[inc].id!=omit) ccollect[inc].style.display="none" inc++ } }[/b] [b]function expandcontent(cid){ if (typeof ccollect!="undefined"){ if (collapseprevious=="yes") contractcontent(cid) document.getElementById(cid).style.display=(document.getElementById(cid).style.display!="block")? "block" : "none" } }[/b] [b]function revivecontent(){ contractcontent("omitnothing") selectedItem=getselectedItem() selectedComponents=selectedItem.split("|") for (i=0; i<selectedComponents.length-1; i++) document.getElementById(selectedComponents[i]).style.display="block" }[/b] [b]function get_cookie(Name) { var search = Name + "=" var returnvalue = ""; if (document.cookie.length > 0) { offset = document.cookie.indexOf(search) if (offset != -1) { offset += search.length end = document.cookie.indexOf(";", offset); if (end == -1) end = document.cookie.length; returnvalue=unescape(document.cookie.substring(offset, end)) } } return returnvalue; }[/b] [b]function getselectedItem(){ if (get_cookie(window.location.pathname) != ""){ selectedItem=get_cookie(window.location.pathname) return selectedItem } else return "" }[/b] [b]function saveswitchstate(){ var inc=0, selectedItem="" while (ccollect[inc]){ if (ccollect[inc].style.display=="block") selectedItem+=ccollect[inc].id+"|" inc++ }[/b] [b]document.cookie=window.location.pathname+"="+selectedItem }[/b] [b]function do_onload(){ uniqueidn=window.location.pathname+"firsttimeload" getElementbyClass("switchcontent") if (enablepersist=="on" && typeof ccollect!="undefined"){ document.cookie=(get_cookie(uniqueidn)=="")? uniqueidn+"=1" : uniqueidn+"=0" firsttimeload=(get_cookie(uniqueidn)==1)? 1 : 0 //check if this is 1st page load if (!firsttimeload) revivecontent() } }[/b] [b]if (window.addEventListener) window.addEventListener("load", do_onload, false) else if (window.attachEvent) window.attachEvent("onload", do_onload) else if (document.getElementById) window.onload=do_onload[/b] [b]if (enablepersist=="on" && document.getElementById) window.onunload=saveswitchstate[/b] [b]</script>
Вставляем, где необходимы блоки с выпадающим текстом:
<h3 onclick="expandcontent('sc1')" style="cursor:hand; cursor:pointer">Выпадающий блок 1</h3> <div id="sc1" class="switchcontent">бла-бла-бла.</div> <h3 onclick="expandcontent('sc2')" style="cursor:hand; cursor:pointer">Выпадающий блок 2</h3> <div id="sc2" class="switchcontent">бла-бла-бла</div> <h3 onclick="expandcontent('sc3')" style="cursor:hand; cursor:pointer">Выпадающий блок 3</h3> <div id="sc3" class="switchcontent">бла-бла-бла.</div>
#9 EL9

Отправлено

Отмена, пока всё работает.
Странное дело, создаю выпадающую таблицу с размерами в карточке "товар" и первые 10 минут она работает (открывается и закрывается) но перезагрузив страницу при нажатии не открывается и начинает показывать ошибку JS (На сайте есть 1 JS ошибка.
Это сообщение покупатели не видят.). Пробовала уже двумя методами из этой темы (сообщения 2 и 7) и в обоих случаях немного работает а затем ошибку выдает. Помогите, пожалуйста.

Сообщение отредактировал EL9: 21 Апрель 2016 - 15:08

#10 Hagiel888

Отправлено

Просмотр сообщенияne_yana (08 Октябрь 2013 - 10:54) писал:

Добрый день, например, если в хотите добавить выпадающий текст на главной странице, то зайдите в админке в раздел Сайт - Страницы, найдите там главную страницу и нажмите "перейти к странице редактирования". На панели редактора нажмите Источник, заключите желаемой слово или фразу в следующий тег:
<a href="javascript:sh()">Подробнее...</a></p> <div id="info" style="padding-top:15px;">ЗДЕСЬ ПИШЕМ ИЛИ ВСТАВЛЯЕМ ТЕКСТ, КОТОРЫЙ ДОЛЖЕН БЫТЬ ПО УМОЛЧАНИЮ СКРЫТЫМ И ПОКАЗЫВАТЬСЯ (РАСКРЫВАТЬСЯ) ТОЛЬКО ПРИ КЛИКЕ НА ССЫЛКУ &quot;ПОДРОБНЕЕ&quot;, СО ВСЕМИ НУЖНЫМИ ТЕГАМИ.</div> <script type="text/javascript"> sh(); function sh() { obj = document.getElementById("info"); if( obj.style.display == "none" ) { obj.style.display = "block"; } else { obj.style.display = "none"; } } </script>
А как сделать несколько раскрывающихся ссылок на одной странице? Если вставляю на страницу 2 такие ссылки, то уже не работает
#11 Vaccina

Отправлено

Здравствуйте.
Попробуйте использовать следующую структуру: <div onclick="$('#spoiler1').toggle(); return(false);"> Заголовок 1 </div> <div id="spoiler1" style="display: none;"> Показать описание 1 </div> <div onclick="$('#spoiler2').toggle(); return(false);"> Заголовок 2 </div> <div id="spoiler2" style="display: none;"> Показать описание 2 </div> <div onclick="$('#spoiler3').toggle(); return(false);"> Заголовок 3 </div> <div id="spoiler3" style="display: none;"> Показать описание 3 </div>
#12 Hagiel888

Отправлено

Просмотр сообщенияVaccina (12 Июль 2017 - 06:09) писал:

Здравствуйте.
Попробуйте использовать следующую структуру: <div onclick="$('#spoiler1').toggle(); return(false);"> Заголовок 1 </div> <div id="spoiler1" style="display: none;"> Показать описание 1 </div> <div onclick="$('#spoiler2').toggle(); return(false);"> Заголовок 2 </div> <div id="spoiler2" style="display: none;"> Показать описание 2 </div> <div onclick="$('#spoiler3').toggle(); return(false);"> Заголовок 3 </div> <div id="spoiler3" style="display: none;"> Показать описание 3 </div>
Спасибо! Все получилось!
#13 Hagiel888

Отправлено

Просмотр сообщенияVaccina (12 Июль 2017 - 06:09) писал:

Здравствуйте.
Попробуйте использовать следующую структуру: <div onclick="$('#spoiler1').toggle(); return(false);"> Заголовок 1 </div> <div id="spoiler1" style="display: none;"> Показать описание 1 </div> <div onclick="$('#spoiler2').toggle(); return(false);"> Заголовок 2 </div> <div id="spoiler2" style="display: none;"> Показать описание 2 </div> <div onclick="$('#spoiler3').toggle(); return(false);"> Заголовок 3 </div> <div id="spoiler3" style="display: none;"> Показать описание 3 </div>
Первая открывается хорошо, а если нажимать на вторую и т.д. ссылки открываются все. Как исправить можно? Нужно чтоб открывалась только одна.
#14 Vaccina

Отправлено

Здравствуйте.
В этом случае используйте следующую конструкцию: <div class="spoilerlink"> Заголовок 1 </div> <div class="spoilercontent"> Показать описание 1 </div> <div class="spoilerlink"> Заголовок 2 </div> <div class="spoilercontent"> Показать описание 2 </div> <div class="spoilerlink"> Заголовок 3 </div> <div class="spoilercontent"> Показать описание 3 </div>
А в конце main.js вставьте:
$(document).ready(function(){ $('.spoilercontent').hide(); $('.spoilerlink').click(function () { $('.spoilercontent').hide(); $(this).next().toggle(); return (false); }); });
#15 Hagiel888

Отправлено

Просмотр сообщенияVaccina (13 Июль 2017 - 09:09) писал:

Здравствуйте.
В этом случае используйте следующую конструкцию: <div class="spoilerlink"> Заголовок 1 </div> <div class="spoilercontent"> Показать описание 1 </div> <div class="spoilerlink"> Заголовок 2 </div> <div class="spoilercontent"> Показать описание 2 </div> <div class="spoilerlink"> Заголовок 3 </div> <div class="spoilercontent"> Показать описание 3 </div>
А в конце main.js вставьте:
$(document).ready(function(){ $('.spoilercontent').hide(); $('.spoilerlink').click(function () { $('.spoilercontent').hide(); $(this).next().toggle(); return (false); }); });
Утро доброе. Получается так, что развернут весь текст во всех ссылках... Может что-то не так делаю?
SL-417511
#16 MikDark

Отправлено

Просмотр сообщенияHagiel888 (13 Июль 2017 - 10:20) писал:

Утро доброе. Получается так, что развернут весь текст во всех ссылках... Может что-то не так делаю?
SL-417511


Здравствуйте. На какой странице у Вас находится такой текст?
#17 Hagiel888

Отправлено

На главной

#18 Hagiel888

Отправлено

Красным это текст, зеленым, то что должно скрываться Прикрепленные изображения Безымянный1.png
#19 MikDark

Отправлено

Просмотр сообщенияHagiel888 (13 Июль 2017 - 11:05) писал:

Красным это текст, зеленым, то что должно скрываться


У Вам была удалена строчка подключения скриптов, Вам ее вернули
#20 Hagiel888

Отправлено

Почему-то изменения ни к чему не привели. Так все и осталось. Скрипт не выпадает

Разворачивающаяся страница как сделать Разворачивающаяся страница как сделать Разворачивающаяся страница как сделать Разворачивающаяся страница как сделать Разворачивающаяся страница как сделать

Изучаем далее:



Поделки на праздник урожая мастер класс

Сделать музыкальные поделки

Как сделать картинг из пилы урал

Сделай своими руками самогон

Поздравление в удачный час радио дача
Читать новость Разворачивающаяся страница как сделать фото. Поделитесь новостью Разворачивающаяся страница как сделать с друзьями!