1

我知道之前有人问过类似的问题,但我想要的是让父级随着元素的滑入而增大。我尝试了很多技巧,包括 jQuery UI。

这是我到目前为止得到的:http: //jsfiddle.net/U8z49/25/

html

<table class="t">
    <tr>
        <td class="l">
            <div>Click me.<br /><br />This div has fixed width of 100px and is taller than the right stuff.</div>
        </td>
        <td class="r">
            <div class="rdiv">I would like this cell or div to slide in from left to right and to cause the parent table and its background to grow along with it. Currently the table first snaps to 100% width, and then the content (the div) slides in.</div>
        </td>
    </tr>
</table>

CSS

.t { background: #ddd; border-radius: 10px; width: auto; }
.l div { width: 120px; margin: 1em; text-align: right; }
.rdiv { padding: 1em; border-left: 1px solid #bbb; display: none; }

js

$('.l').click(function(){$('.rdiv').show("slide", {direction:"left"}, 500);});

正如您所看到的,我的问题是父母先捕捉到 100% 宽度,然后孩子才滑入。

ps 我选择了一个表格和单元格,因为左边的宽度应该是固定的,右边的应该跨越剩余空间到表格保持元素的 100% 宽度(实际设置更复杂,但这就是它的要点)。

4

0 回答 0