0

我的目标是拥有一个动态创建和销毁的 textarea 列表，当我单击一个时，它将展开，如果有一个，则收缩先前聚焦的 textarea，然后在其父 div 中居中。

我有扩展和收缩位。

我无法将其置于视野中心。

我有一个以窗口为中心的 div，从上到下延伸并允许溢出。

______________
| w |    | w  |
|   | d  |    |
|   |    |    |
_______________

如何在其 div 中将焦点集中、现已扩展的 textarea 居中？

这只是将 gui 拆成相关部分的构建......所以它非常糟糕

jsfiddle.net/CPEFk/1/

. . . 我会说 scrollTo 对我或在我笨拙的手套中都证明是无用的......我对此特别感到的问题是两个方面：首先，有时 div 的内容只允许一定的滚动阈值，这可能不足以达到居中位置，

其次，在两个盒子收缩和展开之后，它滚动到的值从最初的调用发生了变化。.is(':animated') 在这方面也提供了一些帮助。我相信这两个在解决方案研究中如此普遍的功能对我来说毫无用处，并且会感谢任何设计工程建议，但如果你能帮助我，即使使用这些也将不胜感激。

这些内置“解决方案”让我头疼的问题让我想到了一些 css 操作，其中我将绝对位置设置为居中，然后遍历每个文本区域并将它们的每个位置设置为距居中元素一定距离。即，如果第三个框被聚焦，它是绝对中心，那么框 1 被重新定位在框 2 之上 3 之上，然后四个 5 和 6 等等也按顺序定位。

这是客户要求的很多工作吗？

这就是 jQuery 的 animate() 所做的吗？DOMwide 影响 css 操作...？

4

1 回答 1

1

所以，

首先，让你$("#foryou").animate() 的回调函数，其次，

$('#foryou').top<--未定义

所以需要改变，

$("#foryou").position().top

变化，

$(document).on('focus', '#foryou textarea', function () {
//$(this).animate({ height: boxheight }, 0);
    var $this = $(this);
    $this.animate({
        height: boxheight
    }, 1000, function () {
        $('#foryou').animate({
            scrollTop: ($this.position().top) + "px"
        });
    });
    ....
});

在每次通话时重置scrollTopof 。#foryou.blur()

$('#foryou').animate({
     scrollTop: "0px"
});

测试链接

于 2013-06-20T08:50:33.787 回答