JQuery показать / скрыть div

0

Я натолкнулся на стену с одной из моих линий jQuery, чтобы показать и скрыть погружение. Я использую одну ссылку (далее...), чтобы показать div и внутри div внизу. У меня есть тесная связь.

Функция show работает отлично, но функция закрытия при закрытии div медленно не оживляется и вызывает прокрутку полосы прокрутки страницы до конца. Я думаю, что это, вероятно, связано с ошибкой в том, как я закодирован, поскольку я довольно новичок в jQuery. Любая помощь будет оценена по достоинству.

Я использую jQuery версии 1.6.4

Код jQuery:

$(document).ready(function(){

$(".toggle_container").hide();
$("#standard_or_custom").hide();    

$("a.trigger").toggle(function(){
    $(this).addClass("active"); 
    }, function () {
    $(this).removeClass("active");
});

$("a.trigger").click(function(){
    $(this).next(".toggle_container").slideToggle("slow,");
});

$("a.close").click(function(){
    $(".toggle_container").hide("slow,");
});


});

HTML:

<a href="#" class="trigger">Read more...</a>

<div class="toggle_container">
<p>
CONTENT HERE
</p>

<a href="#" class="close">Close</a> 

</div>

CSS, который я использую, связанный с этим div:

.toggle_container {
margin:0;
padding:10px 10px;
border: 1px solid #d6d6d6;
background: #f1f1f1;
overflow: hidden;
font-size:.95em;
clear: both;
}
.toggle_container .block {
padding: 20px;
}
.toggle_container .block p {
padding: 5px 0;
margin: 5px 0;
}

.bottom {
margin-bottom:20px;
}
Теги:

2 ответа

6

Существует , в конце slow

$(".toggle_container").hide("slow");

Демо: скрипка

  • 0
    Какой острый глаз. :)
  • 0
    Спасибо, не уловил это ... Я удалил запятую, но у меня все тот же конечный результат.
Показать ещё 3 комментария
0

Nevermind, я понял это; только что добавлен:

        $("a.close").toggle(function(){
    $(this).addClass("active"); 
    }, function () {
    $(this).removeClass("active");
});

вернемся к вершине моей закрытой функции, и это позаботилось об этом.

Полный код:

$(document).ready(function(){

$(".toggle_container").hide();
$("#standard_or_custom").hide();    

$("a.trigger").toggle(function(){
    $(this).addClass("active"); 
    }, function () {
    $(this).removeClass("active");
});

$("a.trigger").click(function(){
    $(this).next(".toggle_container").slideToggle("slow,");
});

    $("a.close").toggle(function(){
    $(this).addClass("active"); 
    }, function () {
    $(this).removeClass("active");
});

$("a.close").click(function(){
    $(".toggle_container").hide("slow");
});


});

Ещё вопросы

Сообщество Overcoder
Наверх
Меню