Сообщений в теме: 20

[GSA0089]

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

Прикрепленные изображения

• 

[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>

[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>

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

Прикрепленные изображения

• 
• 

[ne_yana]

GSA0089 (08 Октябрь 2013 - 11:03) писал:

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

Нужно вставить все, начиная, с

<a

и заканчивая

</script>

, предварительно нажав на панели редактора на Источник.

Прикрепленные изображения

• 

[GSA0089]

ne_yana (08 Октябрь 2013 - 11:10) писал:

Нужно вставить все, начиная, с

<a

и заканчивая

</script>

, предварительно нажав на панели редактора на Источник.

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

Прикрепленные изображения

• 

[ne_yana]

GSA0089 (08 Октябрь 2013 - 11:19) писал:

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

Попробуйте заменить эту строку

<div id="info" style="padding-top:15px;">

на

<div id="info" style="padding-top: 0px; margin-top: -39px;">

[(Рекбес)]

Вставь вот этот код,а информацию,текст на русском напиши свою.

<!-- Блок описания вариантов оплаты -->
<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>

[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>

[EL9]

Отмена, пока всё работает.

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

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

[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 такие ссылки, то уже не работает

[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>

[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>

Спасибо! Все получилось!

[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>

Первая открывается хорошо, а если нажимать на вторую и т.д. ссылки открываются все. Как исправить можно? Нужно чтоб открывалась только одна.

[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);
  });
});

[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

[MikDark]

Hagiel888 (13 Июль 2017 - 10:20) писал:

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

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

[Hagiel888]

На главной

[Hagiel888]

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

Прикрепленные изображения

• 

[MikDark]

Hagiel888 (13 Июль 2017 - 11:05) писал:

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

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

[Hagiel888]

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