Спойлер настраиваемый | Скрипт для сайта uCoz - Разное - Скрипты для укоз - Каталог статей

	Ro-n Computers	Воскресенье, 28.04.2024, 04:24
		Главная Копмпьютеры Notebook Заработок Регистрация Вход

Приветствую Вас Гость | RSS

Меню

Отправка СМС, ММС

Форум

Связь с администрацией

Скачать

Новости сайта

Получи бонус

Понравился наш сайт

Вы можете

Получить

Или

Наш опрос

Оцените мой сайт

1. Отлично

2. Ужасно

3. Хорошо

4. Неплохо

5. Плохо

[ Результаты · Архив опросов ]

Всего ответов: 68

Наша статистика

Онлайн всего: 1

Гостей: 1

Пользователей: 0

сейчас на сайте:
сегодня были:

поиск по сайту

Подписка

Подписка на RSS

Подписка на материалы

Главная » Статьи » Скрипты для укоз » Разное

Спойлер настраиваемый | Скрипт для сайта uCoz

Установка спойлера с кнопкой - надписью, в материале

Установите весь код при добавлении материала.Код добаляйте применяя Панель HTML кодов в материале

<div class= "spoiler">
<div class= "name">
<span>
<center>
Надпись кнопка
</center>
</span>
</div>
<div class= "text">
<center>
<br>
Здесь содержимое спойлера
</center>
</div>
</div>
<style>
div.spoiler div.text {
display: none;
}
</style>
<script>
$(document).ready(function(){
$("div.spoiler div.name span").toggle(function(){
$(this).parent("div.name").parent("div.spoiler").children("div.text").show();
$(this).parent("div.name").parent("div.spoiler").css("backgroundPosition", "-15px 0");
},function(){
$(this).parent("div.name").parent("div.spoiler").children("div.text").hide();
$(this).parent("div.name").parent("div.spoiler").css("backgroundPosition","0 -15px");
});
});
</script>

Установка спойлера с кнопкой - картинкой, в материале

<div class= "spoiler">
<div class= "name">
<span>
<center>
<img src="Здесь ссылка на картинку" alt="Кнопка">
</center>
</span>
</div>
<div class= "text">
<center>
<br>
Здесь содержимое спойлера
</center>
</div>
</div>
<style>
div.spoiler div.text {
display: none;
}
</style>
<script>
$(document).ready(function(){
$("div.spoiler div.name span").toggle(function(){
$(this).parent("div.name").parent("div.spoiler").children("div.text").show();
$(this).parent("div.name").parent("div.spoiler").css("backgroundPosition", "-15px 0");
},function(){
$(this).parent("div.name").parent("div.spoiler").children("div.text").hide();
$(this).parent("div.name").parent("div.spoiler").css("backgroundPosition","0 -15px");
});
});
</script>

Установка спойлера в HEAD

Если Вы хотите использовать спойлер часто,тогда поместите этот код в Верхнюю или Нижнюю часть сайта,остальной код устанавливайте по месту установки в материале.

<style>
div.spoiler div.text {
display: none;
}
</style>
<script>
$(document).ready(function(){
$("div.spoiler div.name span").toggle(function(){
$(this).parent("div.name").parent("div.spoiler").children("div.text").show();
$(this).parent("div.name").parent("div.spoiler").css("backgroundPosition", "-15px 0");
},function(){
$(this).parent("div.name").parent("div.spoiler").children("div.text").hide();
$(this).parent("div.name").parent("div.spoiler").css("backgroundPosition","0 -15px");
});
});
</script>