0

Есть такой кусок скрипта, который при клике на ссылку проверяет, если ли div с #number, если нет, то добавляет, если есть, то удаляет его.

$('.dealers .link-wrapper a.link').on('click', function(e){
            e.preventDefault(); 
            //Послать AJAX запрос
            var pos = $(this).find_place_for_dealer().data('pos');  
            var number = $(this).find_place_for_dealer().data('number');

            if ($('div#' + number).length == 0) {   
                $(this).addClass('hover');
                var el = '<div id="' + number +'" class="col-lg-12 col-md-12 col-sm-12 col-xs-12"><div class="dealer-full-info"><a href="" class="closebtn-dealer"></a><div class="row"><div class="col-lg-2 col-md-2 col-sm-12 col-xs-12"><img src="/img/img_11.jpg" class="cover" ></div><div class="col-lg-10 col-md-10 col-sm-12 col-xs-12"><div class="title">ООО «Рельеф-М» </div><div class="address">Адрес <span class="adress-inner">г. Москва, ул. Подольских курсантов, д. 3, стр. 2</span></div><div class="map"><img src="/img/img_7.jpg"></div><div class="phone">Тел./факс: +7 (495) 510-43-67</div><div class="mail">Электронная почта: <a href="mailto:secretar@msk.relef.ru">secretar@msk.relef.ru</a></div></div></div></div></div>';        
                $('div.link-wrapper').eq(pos).after(el);
            }
            else {
               $(this).removeClass('hover');
               $('div#' + number).slideUp('1000').remove();
            }

не могу понять, почему в куске

$('div#' + number).slideUp('1000').remove();

не работает slideUp, не происходит сворачивания блока вверх, а он просто удаляется.
Как заставить slideUp работать ?

2 ответа 2

2
$('div#' + number).slideUp(1000, function(){$(this).remove();});

Как добавить .slideDown элементу (посмотреть пример)

$('div.link-wrapper').eq(pos).after(el);
$('div.link-wrapper').eq(pos).next().hide().slideDown(1000);
2
  • большое спасибо за помощь! а можете объяснить, почему здесь цепочка методов не работает, а надо делать такую функцию?
    – Heidel
    5 мар 2014 в 6:09
  • @VenZell спасибо за помощь, теперь все работает )
    – Heidel
    5 мар 2014 в 7:33
1

Потому что slideUp ставит анимацию в очередь, а remove удаляет незамедлительно, не давая очереди выполниться. Вам нужна такая конструкция:

$('div#' + number).slideUp(1000, function(){
    $(this).remove();
});
10
  • а подскажите, вот здесь $('div.link-wrapper').eq(pos).after(el); можно сделать так, чтобы блок не просто добавлялся, а был плавный slideDown ?
    – Heidel
    5 мар 2014 в 6:17
  • $('div.link-wrapper').eq(pos).after(el).hide().slideDown()
    – etki
    5 мар 2014 в 6:39
  • не, не так, можно как-то сделать, чтобы тот элемент el , который добавляется через after(el) разворачивался медленно?
    – Heidel
    5 мар 2014 в 6:43
  • @Heidel, обновил ответ
    – VenZell
    5 мар 2014 в 6:58
  • @Heidel $('div.link-wrapper').eq(pos).after(el).hide().slideDown(2000);
    – etki
    5 мар 2014 в 6:58

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.