文章/答案/技术大牛

发布

社区首页 >问答首页 >如何让CSS动画在JQuery或页面加载后等待加载

问如何让CSS动画在JQuery或页面加载后等待加载
EN

Stack Overflow用户

提问于 2017-08-30 03:42:48

回答 1查看 289关注 0票数 0

我构建了一个使用CSS关键帧运行的SVG动画。它在桌面上工作得很好，但当它在速度较慢的移动设备上运行时，页面加载时动画几乎结束。

问题是我使用的是CSS (动画延迟: 3s)，但是页面需要大约4秒的加载时间，所以当它加载时，我的动画已经开始了。我需要页面完全加载，并在CSS动画开始之前加载我的Jquery！

基本上，如何让页面在CSS动画延迟属性运行之前完全加载，或者如何在Jquery文档就绪加载之后运行。

jquery

css

回答 1

Stack Overflow用户

发布于 2017-08-30 05:10:49

我有一些关于如何做到这一点的想法。

您可以将动画设置为在5秒后加载。

或者，创建一个轻量级的移动版本。或者找出影响页面加载时间的因素。使用最低版本。

编辑:根据移动像素尝试(动画-延迟: 5)。

@media (min-width: 576px) {

}

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/45951525

复制

用jquery刷新或重新加载页面

jq 开发

在网页开发过程中，经常会遇到需要重新加载或刷新页面，下面我来说一下如果通过jq来刷新或重新加载页面，来看代码。

OECOM

2020/07/01

7.2K0

jQuery页面加载完毕后执行事件

jquery css html

window.onload 表示的是页面被加载完毕。 <img src=”htttp://baidu.com/156.jpg”/> onload必须等等页面中的图片、声音、图像等远程资源被加载完毕后才调用而jQuery中只需要页面结构被加载完毕。

葆宁

2019/04/19

21.3K1

css实现页面加载动画

css 动画

一.代码 <div id="loading"> <div id="loader-wrapper"> <div id="loader"></div> <div class="loader-section section-left"></div> <div class="loader-section section-right"></div> <div class="load_title">正在加载中...........</div>

小小咸鱼YwY

2020/08/11

3.9K0

selenium之等待页面（或者特定元素）加载完成

网站 selenium https 网络安全

kirin

2021/03/18

5.4K0

jquery等待特定元素加载再执行相关函数

函数

默认是执行100次，每次间隔20毫秒，最长等待时间是2000毫秒（2秒），如果要一直等待到元素出现，可以将100改成任意负数。

怪兽

2022/10/04

1.4K0

EasyCVR启动后无法加载页面该如何解决？

网络摄像机 ini vr web 视频

EasyCVR是我们支持协议最全面的视频平台，并且平台兼容性非常高，支持多类型的设备接入，包括传统网络摄像机、NVR、编码器、4G移动执法仪等视频源设备接入。平台支持兼容不同品牌、不同型号的视频平台及设备，解决技术兼容性问题，能实现非国标设备国标化处理，可消除数据孤岛，实现数据互联互通、共享对接。

TSINGSEE青犀视频

2022/08/19

9490

原生js与jquery加载页面元素比较

jquery

声明：本文为原创，作者为对弈，转载时请保留本声明及附带文章链接：http://www.duiyi.xyz/%e5%8e%9f%e7%94%9fjs%e4%b8%8ejquery%e5%8a%a0%e8%bd%bd%e9%a1%b5%e9%9d%a2%e5%85%83%e7%b4%a0%e6%af%94%e8%be%83/

对弈

2019/09/04

11.7K0

CSS3的loading制作，让页面加载时不再单调

css

页面的loading效果一直都是个比较重要的制作，往往一个好的加载效果可以有效的提升用户体验。而实际开发中，loading效果具体该如何制作？前端工程师又会有哪些特殊的技能呢？本文主要内容 1、效果

HTML5学堂

2018/03/13

2.1K0

vue 重新加载页面_页面重新加载

https 网络安全 vue.js

全栈程序员站长

2022/11/03

5K0

用jQuery模拟页面加载进度条

jquery html 企业

　　因为我们无法通过任何方法获取整个页面的大小和当前加载了多少，所以想制作一个加载进度条的唯一办法就是模拟。那要怎么模拟呢？

胡尐睿丶

2022/03/23

2.2K0

基于jQuery或Zepto的图片延迟加载插件

javascript jquery

当我们网站的页面图片过多时，加载速度就会很慢。尤其是用手机2G/3G访问页面，不仅页面慢，而且还会用掉很多流量。我们主题之前也都采用了图片的懒加载形式，但都不完美，部分主题还采用了占位图片来控制懒加载，今天换一种js图片懒加载，它原理就是将页面内所有需要加载的图片全部换成一张默认的图片（一般尺寸很小），只有图片在可视区域才去请求加载，这样的话应该就能满足我们日常所需，好了不说废话先按照教程操作试试，后期主题会逐一更新，稍安勿躁！！！

李洋博客

2022/11/03

3.3K0

pyppeteer实现不加载image,css等大文件, 缩短页面加载时间

爬虫自动化

在很多时候, 写爬虫的过程中, 不得不使用一些自动化工具来完成抓取, pyppeteer就是一个很好的选择, 一般情况下, 会选择页面加载完成后, 点击按钮等等, 但是有时候, 我们只需要其中的一些数据, 比如a标签的href, 其它的都不重要, 等待其它文件加载, 反而会影响爬虫的效率, 这时候, 就可以选择过滤一些无用文件的加载, 在缩短页面加载时间

不止于python

2022/07/20

1.6K0

[WPF自定义控件库] 让Form在加载后自动获得焦点

编程算法 windows wpf

加载后让第一个输入框或者焦点是个很基本的功能，典型的如“登录”对话框。一般来说“登录”对话框加载后“用户名”应该马上获得焦点，用户只需输入用户名，点击Tab，再输入密码，点击回车就完成了登录操作。

dino.c

2019/06/03

1.7K0

页面加载代码

css footer

在footer文件添加以下内容少女祈祷中... document.onreadystatechange = function() 　　//当页面加载状态改变的时候执行function { 　　 if(document.readyState == "complete"){ var df = document.getElementsByClassName("Bg_Th")[0]; df.style.display="none"; 　 } } 自

云计算小黑

2022/12/28

3.2K0

css加载慢导致加载瞬间白屏（dom比css加载快导致）

css

2，css样式压缩下，用sass编译一下，放在head顶部，head再用incloud包起来，放在文件夹；

kirin

2020/11/30

2.3K0

页面加载代码

php css footer

在footer.php文件最下面添加以下内容院长正在为您加急渲染... document.onreadystatechange = function() 　　//当页面加载状态改变的时候执行function { 　　 if(document.readyState == "complete"){ var df = document.getElementsByClassName("Bg_Th")[0];

院长技术

2022/03/10

3.2K0

jquery预加载图片

jquery

(function($) { var cache = []; // Arguments are image paths relative to the current page. $.preLoadImages = function() { var args_len = arguments.length; for (var i = args_len; i--;) { var cacheImage = document.createElement('img');

用户8671053

2021/09/23

8.2K0

jquery 加载 - ready方法

javascript jquery

将获取元素的语句写到页面头部，会因为元素还没有加载而出错。 JavaScript为了避免加载页面的元素报错的问题，需要在加载之中增加window.onload方法。如下：

Devops海洋的渔夫

2019/05/30

2K0

页面加载中jquery逐渐消失效果实现

jquery html

为了获得更好的用户体验，现在大多数网页都会在页面中加一个加载中效果，这里实现一个加载中逐渐消失的效果，以至于看上去不那么生硬。 html: <div id="loading"><img src="images/common/loading.gif" alt=""></div> css: /*加载中*/ #loading{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; backgroun

蓓蕾心晴

2018/04/12

2.4K0

点击加载更多

相似问题

如何防止CSS动画在页面加载？

如何让webrat / selenium“等待”页面的CSS加载？

防止CSS3动画在页面加载后触发

页面加载后等待元素加载

Jquery等待/页面加载

添加站长进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

问如何让CSS动画在JQuery或页面加载后等待加载
EN