Question

我正试图在固定标题上方放置一张幻灯片。我可以让div滑下来，但我不能让它滑回来。

这是我的小提琴...... http://jsfiddle.net/amesy/w83dwwpL/

我已经在另一个小提琴形式中修改了代码，可以在http://jsfiddle.net/darcyclarke/JNRpK/28/light/

找到

正如您所看到的那样，原始小提琴没有使用相同的按钮关闭div元素。

不使用下面代码中的宽度动画。

$(document).ready(function () {

var open = 0;
$( ".contact a" ).addClass( "open" );


    $(".contact a.close").bind("click", function(e){

        $("#contactContainer").animate({"height":"0px"}, 1000);    

        $( ".contact a" ).removeClass( "close" );
        $( ".contact a" ).addClass( "open" );

        open = 0;
    });


    $(".contact a.open").bind("click", function(e){

        $("#contactContainer").animateAuto("height", 1000); 

        $( ".contact a" ).removeClass( "open" );
        $( ".contact a" ).addClass( "close" );

        open = 1;
    });


jQuery.fn.animateAuto = function(prop, speed, callback){
var elem, height, width;
return this.each(function(i, el){
    el = jQuery(el), elem = el.clone().css({"height":"auto","width":"auto"}).appendTo("body");
    height = elem.css("height"),
    width = elem.css("width"),
    elem.remove();

    if(prop === "height")
        el.animate({"height":height}, speed, callback);
    else if(prop === "width")
        el.animate({"width":width}, speed, callback);  
    else if(prop === "both")
        el.animate({"width":width,"height":height}, speed, callback);
});  
}

});

Answer 1

你只需使用切换即可。（你不需要使用开放和关闭课程）

使用以下代码。

$("#contactContainer").animate({"height":"toggle"}, 1000);

Check Out updated JSFiddle

固定标题上方的SlideDown表单不会向上滑动

1 个答案: