2013-06-11 2 views
1

Вот что я пытаюсь сделать - у меня есть эта структура моей страницы:.slideUp() не работает

<div id="wrapper"> 
    <div id="page_banner"> 
     <canvas id="voucher_canvas"></canvas> 
     <div id="div_voucher_img"><img id="voucher_img" src="" /></div> 
    </div> 

    <div id="content"> 
     inner divs with contact form... 
     <div id="div_send_form"></div> 
    </div> 
</div> 

Когда страница загружается - я пряча #page_banner и #voucher_canvas с JQuery:

$("#page_banner, #canvas_voucher, #div_print_voucher").hide(); 

Когда пользователь заполняет форму и нажимает на #div_send_form, он должен сделать ваучер на холсте, с некоторыми из деталей он вошел, а затем создать образ из этого холста. После этого я хочу slideUp() (скрыть) #content DIV и на завершение slideDown() (шоу) в #page_banner DIV:

$("#content").slideUp(400, function() { 
    $("#page_banner, #div_print_voucher").slideDown(1000); 
}); 

По какой-то причине он не делает slideUp(), но после того, как 400мс просто скрывает #content DIV и slideDown() - #page_banner.

Почему это происходит?

Я попытался создать jsfiddle, но, я думаю, он не поддерживает холст, поэтому он точно не работает там.

ответ

0

найдена проблема: Высота #content DIV был определен в CSS следующим образом:

height:640px !important; 

!important часть предотвращала его от скольжения правильно. Как только он был удален - все работало нормально.

+0

Да, в целом 'важные' хорошие, чтобы их избежать. Я думаю о них скорее как о взломе, чем о хорошем коде. –