jquery - 如何处理 jQuery 中的多个元素?

标签 jquery jquery-ui user-interface

我希望创建一个由不同面板组成的网站。 假设我们有 4 个面板。每个面板在给定时间点占据整个屏幕,看起来与此类似

--------------------------------
|     home     ||     about    |
|    a menu    ||    a menu    |
|              ||              |
--------------------------------
--------------------------------
|    contact   ||     jobs     |
|    a menu    ||    a menu    |
|              ||              |
--------------------------------

假设我现在点击主页上的“职位”链接。 我希望屏幕以动画方式垂直滚动到包含所有项目的容器的右下角。

这并不是什么大问题,我知道我可以使用 ScrollTo 之类的插件来实现这一点。 .

现在想象一下,我有 16 页,而不是 4 页。 该插件可以轻松缩放,但由于页面上存在如此多的元素(每个面板包含图像、文本、菜单、标题等),因此网站速度显着减慢。

当我已经位于给定页面上时,我可以通过隐藏所有其他页面来解决此问题 - 但是如何在从一个面板到另一个面板进行动画处理时处理所有元素? 有什么实现的想法吗?

谢谢!

最佳答案

不要将所有内容加载到 DOM,使用 ajax 并拉取您需要的内容并删除您不需要的内容。我在一个与你所描述的非常相似的网站上工作,我走了“隐藏 dom 中的所有内容”路线,我最终不得不重新编写部分内容以使用 ajax,因为页面加载时间太长。

关于jquery - 如何处理 jQuery 中的多个元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6820741/

相关文章:

javascript - Jquery自动完成键按下显示标签名称而不是值?

jquery - 如何访问放入可排序的可拖动元素的ID

swift - 如何并行使用@State和@Binding?

javascript - 如何在加载新选项卡时显示每个选项卡内容并隐藏以前的内容

javascript - 如何使用 javascript 获取我的 css 元素的最大宽度

jquery-ui - jQueryUI 自动完成 - 无法显示返回的选择(Coldfusion)

android - 在 SlidingTabStrip android 中固定宽度

javascript - Bootstrap 中的折叠元素

jquery - jqGrid:自定义删除消息

javascript - 在 chrome 扩展中向用户显示消息