Помогите внести коррективы в скрипт (кликабельная кнопка)

Поделиться12011-01-14 09:40:33

Автор: Ksana
Помощник ZeroParking
Откуда: Місто Lemberg
Зарегистрирован: 2008-07-04
Приглашений: 0
Сообщений: 683
Уважение: +47
Позитив: +91
Провел на форуме:
7 дней 7 часов
Последний визит:
2012-05-24 19:40:08

Помогите, пожалуйста, вот с таким делом...

Код:

<center><style type="text/css">
#spo_all {margin: 0 auto 0 auto;}
#spo_top {border: 0px solid; color: #000; font-weight: bold; font-family: "Courier New", Courier, monospace; font-size: 12px; margin: 8px auto 0 auto;
padding: 0px; cursor: pointer;}
#spoiler4 { border: 1px dotted #000; border-top: 0; padding: 4px; margin: 0 auto 8px auto; display:none;}
#spo_option { font-weight:bold; cursor:pointer; float:left;}
#spo_desc { float:right;}
</style>
<div class="main" id="spo_all"><img src="кнопка" class="category"   id="spo_top" onclick="obj=this.parentNode.childNodes[1].style; tmp=(obj.display!='block') ? 'block' : 'none'; obj.display=tmp; return false;"><div id="spoiler4">контент</iframe><br /></div></div></center>

Попрошу, кому не будет в тягость, внести пару изменений:
1. Две кнопки, вместо одной (открытая и закрытая кнопки);
2. Контейнер должен быть в развернутом виде при загрузке страницы (сейчас он по умолчанию свернут).
Спасибо заранее.

Отредактировано Ksana (2011-01-26 22:59:17)

0

Поделиться22011-01-14 11:05:46

Автор: Deff
Помощник ZeroParking
Зарегистрирован: 2010-09-17
Приглашений: 0
Сообщений: 3019
Уважение: +912
Позитив: +117
Провел на форуме:
1 месяц 4 дня
Последний визит:
2014-03-14 16:00:36

Код:

<center><style type="text/css">
#spo_all {margin: 0 auto 0 auto;}
#spo_top {border: 0px solid; color: #000; font-weight: bold; font-family: "Courier New", Courier, monospace; font-size: 12px; margin: 8px auto 0 auto;
padding: 0px; cursor: pointer;}
#spoiler4 { border: 1px dotted #000; border-top: 0; padding: 4px; margin: 0 auto 8px auto;}
#spo_option { font-weight:bold; cursor:pointer; float:left;}
#spo_desc { float:right;}
</style>
<div class="main" id="spo_all"><img src="Кнопка Открытия" alt="Кнопка Открытия" id="onn_button" onclick="obj=this.parentNode.childNodes[3].style; obj.display='block';"/>Тут либо текст - либо картинка прозрачкой для развижки кнопок<img src="Кнопка Закрытия" alt="Кнопка Закрытия" id="off_button" onclick="obj=this.parentNode.childNodes[3].style; obj.display='none';"/><div id="spoiler4">контент<br /></div></div></center>

Отредактировано Deff (2011-01-14 13:50:03)

+1

Поделиться32011-01-21 01:52:20

Автор: Ksana
Помощник ZeroParking
Откуда: Місто Lemberg
Зарегистрирован: 2008-07-04
Приглашений: 0
Сообщений: 683
Уважение: +47
Позитив: +91
Провел на форуме:
7 дней 7 часов
Последний визит:
2012-05-24 19:40:08

Deff, пыталась разобраться, но все никак.
То и я что-то упускаю, то ли вы не совсем поняли, о чем я просила. Мне нужно одно, чтобы кнопка из открытой "превращалась" в закрытую в процессе сворачивания-разворачивания содержимого контейнера.
Но пользуясь предложенным кодом я получаю:

Кнопка свернуть (картинкой, разумеется) Тут либо текст - либо картинка прозрачкой для развижки кнопок Кнопка развернуть
И все вот так стоит в один ряд. :dontknow:
Не понимаю, какой между кнопками должен быть текст? Зачем он? Да и никакой переходной стадии не ну нужно. Все куда проще: кликнул на кнопку - кнопка поменялась.