【问题标题】:jquery animate: How can I get the height of element dynamically for animation?jquery animate:如何动态获取动画元素的高度?
【发布时间】:2011-09-01 02:19:08
【问题描述】:

如何动态获取animate() 的元素高度?

这是我在元素中显示更多隐藏文本的代码。问题是我必须将动画高度(例如 300 像素)固定为固定数字,并且文本不断更改,所以我不知道它会持续多久。

$('.toggle-slide').click(function() {

      var object = $(this);
      var object_target = $('.text-about');
      var target_height = object_target.height();

     object_target.animate({
        height:'300px'
      }, 1500 );


      return false;
 });

所以我认为应该动态获取元素的实际高度然后我可以将此参数传递给animate()

但是我怎样才能得到这个动态高度呢?

或者你有其他更好的想法?

这是我的测试link

【问题讨论】:

  • 您可以使用 [.height]() 在 jQuery 中获取元素的高度,除非该元素在调用时被隐藏。那么你必须对它有点偷偷摸摸。当您尝试获取其高度时,动态元素是否隐藏?
  • 是的,从这里你可以看到它从一开始就被隐藏了 - jsfiddle.net/unLBu/2

标签: jquery height jquery-animate slidetoggle


【解决方案1】:
$('.toggle-slide').click(function() {

      var object = $(this);
      var object_target = $('.text-about');
      var target_height = object_target.height('100%').height();

      object_target.height('200px');

      object_target.animate({
        height: target_height + 'px'
      }, 1500 );


      return false;
 });

我首先让它全部可见,然后取高度,然后放回 200px 并制作动画:)

在较慢的机器上可能会闪烁,但这是一个想法

【讨论】:

    猜你喜欢
    • 2010-11-20
    • 2011-08-05
    • 2020-09-09
    • 2012-06-14
    • 2017-07-20
    • 2012-02-16
    • 2012-06-19
    • 2021-12-12
    • 2017-10-21
    相关资源
    最近更新 更多