在 jQuery 中显示隐藏 DOM 元素之前调整其大小
我在我们建立的很多网站中都遇到过这个问题。基本上，全局范围是这样的：
- 网站应适应所有不同的窗口大小
- 用户使用键盘或鼠标在其中导航
- 页面的所有不同部分都已经存在（隐藏）或通过 Ajax 加载（不更改 url）
- 一些元素（如图像）需要保持原始宽高比
- 某些元素（如段落）具有固定宽度，但没有已知高度（自动）
- 当网站加载时，只有第一部分可见。
现在，我尝试了以下操作：
- 在初始化时保存所有元素的原始宽度和高度：这会失败，因为未加载图像...
- 在加载时保存所有元素的原始宽度和高度：这会增加不需要的延迟
- 进行混合前两个解决方案中，在文本初始化时，在图像加载时：这可以按需要工作，但前提是该元素可见并且他的所有父母也是可见的。
- 关于调整大小，显示全部，调整大小，隐藏那些需要隐藏的......这落后于所有浏览器。
- 调整大小停止时（上次调整大小事件后 50 毫秒）：这会阻止所有单独调整大小事件上的动画流。
那么，这给我们带来了问题标题...
有人对这种情况有了解吗？
I have been having this problem in a lot of websites we build. Basicaly, the global scope is this:
- The website shall adapted itself to all different window sizes
- Users navigate in it with the keyboard OR the mouse
- All the different sections of pages are already there (hidden) or loaded via Ajax (no url change)
- Some elements (like images) need to keep the original aspect ratio
- Some element (like paragraphs) have a fixed width, but no known height (auto)
- When the website load, only the first section is visible.
Right now, I tried this:
- Saving all the element's original width and height on init: This fails because images are not loaded...
- Saving all the element's original width and height on load: This adds a delay that is not wanted
- Do a mix of the two first solution, on init for text, on load for images: This works as wanted, but only if the element is visible and that all his parents are too.
- On resize, show all, resize, hides those that need to be hidden... This lagged all browsers.
- On resize stop (50 msec after the last resize event): This prevent the animated flow on all individual resize events.
So, this brings us to the question title...
Anybody has something on this kind of situation ?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论