Здравствуйте всем! Появилась проблема с скриптом "Собственный спойлер с плавным открытием и скрытием содержимого". Содержимое привожу ниже.
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Спойлер №1</title>
<base href="http://usefulscript.ru/">
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<style type="text/css">
.spoiler_body { display:none; font-style:italic; }
.spoiler_links { cursor:pointer; font-weight:bold; text-decoration:underline; }
.blue { color:#000099; }
.green { color:#009900; }
.spoiler_close
</style>
</head>
<body>
<div class="spoiler_links blue">Спойлер №1 (кликните для открытия/закрытия)</div>
<div class="spoiler_body">
Текст под спойлером<br>
имеет класс spoiler_body.<br>
Для придания стиля данному тексту<br>
просто добавьте еще один класс.
<br>
<div class="spoiler_close">Закрыть спойлер</div>
</div>
<br>
<div class="spoiler_links green">Спойлер №2 (кликните для открытия/закрытия)</div>
<div class="spoiler_body">
А это уже текст второго спойлера!<br>
Данный спойлер также позволяет скрывать<br>
излишнее на сайте!
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.spoiler_links').click(function(){
if ($(this).next('.spoiler_body').css("display")=="none") {
$('.spoiler_body').hide('normal');
$(this).next('.spoiler_body').slideToggle('normal');
}
else $('.spoiler_body').hide('normal');
$('.spoiler_close').click(function(){
$(this).parent('.spoiler_body').toggle('normal');
});
return false;
});
});
</script>
</body>
</html>
Скрипт работает отлично.
Проблема состоит в следующем.
В тело спойлера добавлен контейнер закрытия спойлера
Код:
<div class="spoiler_close">Закрыть спойлер</div>
а в сам скрипт строки:
Код:
$('.spoiler_close').click(function(){
$(this).parent('.spoiler_body').toggle('normal');
});
И здесь наблюдается интересная работа скрипта. Описываю подробно.
Нажимаю "Спойлер №1 (кликните для открытия/закрытия)", спойлер открывается.
Нажимаю "Закрыть спойлер", спойлер закрывается (здорово).
Сразу же нажимаю "Спойлер №1 (кликните для открытия/закрытия)" второй раз, спойлер открывается.
Нажимаю "Закрыть спойлер", спойлер закрывается и сразу же открывается, так и остается открытым.
Нажимаю "Спойлер №1 (кликните для открытия/закрытия)" третий раз, спойлер открывается.
Нажимаю "Закрыть спойлер", спойлер закрывается и сразу же открывается 2 раза и остается открытым.
И так до 5 раз. Дальше не хватило терпения.
Что за счетчик такой интересный.
Пробовал в теги <style></style> добавить строчку .spoiler_close также не спасает.
Поиск
Пользователи
Календарь
Справка
/
Проблемы с скриптом "Собственный спойлер с плавным открытием и скрытием содержимого"
