本文介绍了如何在jQuery动画中设置“自动"高度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问题:我有一个固定宽度的盒子(div),但高度(自动)未知.

Problem:I've a box(div) with fixed width but unknown (auto) height.

我需要使用JQuery动画功能打开/关闭该框.

I need to open/close that box using JQuery animate function.

Open事件中存在问题(在代码中也有注释),我需要设置自动高度,但我无法做到.有人可以帮忙将高度设置为自动吗?

Problem is (commented in code too) on Open event, I need to set auto height, which I'm not able to do. Can someone please help set height to auto?

JSFiddle: http://jsfiddle.net/7m5Qa/代码也如下所示:

JSFiddle: http://jsfiddle.net/7m5Qa/Code also given below:

HTML

<button id="open">open</button>
<button id="close">close</button>
<div id="textselector-body">
    a<br/>
    b<br/>
    c<br/>
</div>​

Java脚本

$(document).ready(function(){
    $("#open").click(function(){
        $("#textselector-body").animate({
            height:'100px' //here is problem. I need it 'auto'.
        },2000);
    });
    $("#close").click(function(){
        $("#textselector-body").animate({
            height:'0'
        },2000);
    });
});​

推荐答案

您是否尝试过slideDown和slideUp? :

Have you tried slideDown and slideUp ? :

$(document).ready(function(){
    $("#open").click(function(){
        $("#textselector-body").slideDown(2000);
    });
    $("#close").click(function(){
        $("#textselector-body").slideUp(2000);
    });
});​

jsFiddle: http://jsfiddle.net/7m5Qa/2/

jsFiddle: http://jsfiddle.net/7m5Qa/2/

这篇关于如何在jQuery动画中设置“自动"高度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-05 01:20