Как сделать спойлер на своих страничках - Шаблоны VamShop
У нас Vam Shop стоит дешевле на 25%
Ваша корзинаВ корзине: 0 товар(ов).
Продвижение сайта собственным контентом
Информация
Уточните все вопросы и сделайте заказ:
E-mail: monamurs@gmail.com
ICQ: 5864444
Мой статусSkype: lifemakeroff
Способы оплаты:
Webmoney,
Money.Yandex,
QIWI,
карта Сбербанка РФ,
Paypal,
а также системы переводов: Контакт, Анелик, Аллюр, Western Union.
Шаблоны для интернет-магазинов. Нами украшено более 400 магазинов!
Отзывы more
Шаблон VamShop
3 мая 2011 protherm-group написал отзыв: Заказал у Yurassik1 шаблон на VamShop для магазина, всё сделал очень быстро и качественно.Yurassik1 - больше [...]

5 из 5 звёзд!

Как сделать спойлер на своих страничках

Иногда при разработке интернет магазина возникает необходимость спрятать какой-либо контент на странице, но чтобы его можно было посмотреть, кликнув на кнопку "Развернуть" или "Показать". Сделать это очень просто с помощью так называемого html-спойлера.

Скопируйте нижеприведенный html-код и вставьте в любую страницу своего сайта (в режиме html-кода, если работаете с wysiwyg редактором). Надеюсь, дальше разберетесь, что к чему в этом коде. ;)

<div style="margin: 2px; margin-top: 1px;">
<div style="margin-bottom: 2px;"><strong>Спойлер</strong>:<input style="font-size: 10px; margin: 0px; padding: 0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Спрятать'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Показать'; }" type="button" value="Показать" /></div>
<div style="margin: 0px; padding: -1px; border: 2px inset;">
<div style="display: none;"><br />
<div><img src="http://savepic.org/1172973.jpg" border="0" alt="" /></div>
<br />
<div>С праздником вас!</div>
</div>
</div>
</div>


Посмотреть, как работает спойлер, можно тут - http://old.clipartmag.ru/update-vamshop162.html
Выражаем благодарность http://b-kill.ru за код.

Просмотров: 5934

Дата: Воскресенье, 20 Февраля 2011