使子div改变大小后周围的DIV平滑调整
这会很长...
好吧，所以我想要完成的是当子 div 更改时使外部 div 更改大小，但该更改当前是一个闪烁的运动，它从点“a”到点“b”。
我解释的另一种方式：
- 原始尺寸：
内部div：300px x 300px
外部div：300px x 500px
- 新尺寸：
内部div：300px x 400px
外部div：300px x 600px
当内部div时，它强制外部 div 更改为新尺寸的高度。转换发生的方式如下：
原始页面 ->淡出当前内容 ->加载新内容->淡入新内容 ->将外部尺寸轻弹到位
我正在尝试将其设置为：
原始页面->淡出当前内容 ->使用动画调整外部尺寸 ->加载新内容->淡入新内容
代码
jQuery
$(this).click(function(){ 当前页面项 = $(this); elem = $(this).attr('id'); view = 'views/' + elem + '.php'; $('#content').fadeOut('慢', function() { $(this).hide(); $(this).load(视图, 函数() { $(this).fadeIn('慢'); }); });
This is going to be long...
Okay, so what I'm trying to accomplish is making the outer div change size when the child div changes, but the change is currently a flickering motion, it goes from point "a" to point "b".
Another way of my explaining:
- Original Dimensions:
Inner div: 300px by 300px
Outer Div: 300px by 500px
- New Dimensions:
Inner div: 300px by 400px
Outer div: 300px by 600px
When the inner div, it forces the outer div to change to the height of the new dimensions. The way the transitions are happening are like this:
Original page -> Fade out current content -> Load new content -> Fade in new content -> flick outer dimensions into place
I'm trying to get it like:
Original page -> Fade out current content -> adjust outer dimensions with an animate -> Load new content -> Fade in new content
The code
The jQuery
$(this).click(function(){ currentPageItem = $(this); elem = $(this).attr('id'); view = 'views/' + elem + '.php'; $('#content').fadeOut('slow', function() { $(this).hide(); $(this).load(view, function() { $(this).fadeIn('slow'); }); });
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
将内部 div 的 CSS 设置为“height:100%;”。这样你只需要调整外部 div 的大小。
如果有一些细节我不明白，也许 jsfiddle 会有所帮助。
Set the CSS of the inner div to "height:100%;". That way you only have to resize the outer div.
If there's some detail Im not understanding, probably a jsfiddle would help.