jQuery和CSS->延迟显示
我用jQuery实现了一个旋转木马 有时我在页面上有其他东西,可能需要一些时间来加载,结果是旋转木马开始显示,但没有CSS呈现OK。这将给出一行旋转木马中仅显示在页面上的所有图像 给它0.2秒,一切正常,即CSS启动,旋转木马正确显示 我的问题是,是否有一种方法可以绕过它,或者甚至有一种标准方法可以延迟旋转木马的显示,直到我们确定页面的其余部分已加载jQuery和CSS->延迟显示,jquery,css,Jquery,Css,我用jQuery实现了一个旋转木马 有时我在页面上有其他东西,可能需要一些时间来加载,结果是旋转木马开始显示,但没有CSS呈现OK。这将给出一行旋转木马中仅显示在页面上的所有图像 给它0.2秒,一切正常,即CSS启动,旋转木马正确显示 我的问题是,是否有一种方法可以绕过它,或者甚至有一种标准方法可以延迟旋转木马的显示,直到我们确定页面的其余部分已加载 转盘已设置为加载到document.ready。您尚未说明转盘是如何实现的;html代码是什么样子的,您使用的是什么jquery插件,css是什么
转盘已设置为加载到document.ready。您尚未说明转盘是如何实现的;html代码是什么样子的,您使用的是什么jquery插件,css是什么样子的,所以很难回答这个问题 听起来像是使用jquery将页面中的图像标记转换为旋转木马。如果所有图像都在同一个div内,则只需使用display:hidden隐藏该div即可。如果希望在加载css之前隐藏它们,则需要将此css设置作为属性直接应用于div标记
更好的解决方案是在页面加载后使用javascript/jquery添加图像。这样,在css或jquery准备就绪之前,它们不会呈现为一行。如果使用javascript添加所有图像,则对于禁用javascript的用户,它根本不会显示任何内容。因此,如果您的旋转木马显示得太早,那么您可能需要将调用旋转木马的脚本移动到页面底部。在页面加载时向正文添加一个js类 不要将旋转木马仅限于启用javascript的用户, 将这些图像引用为
.js .imgParent > img {
display: none
}
然后可以在javascript中重新引用这些图像并重新启用它们
没有javascript的用户将显示常规图像请看,您根本不需要知道代码。一个非常好的答案。非常感谢。