草庐IT

纯前端

全部标签

只会用插件可不行,这些前端动画技术同样值得收藏-JavaScript篇(下)

目录前言介绍基本使用关键帧KeyframeEffect的三种类的声明keyframesoptions动画对象全局Animation类标签中的animate函数总结相关代码:前言接着上文往下介绍,上篇文章我们对JS原生动画和贝塞尔曲线有了一个详细的认识,基于定时器或动画帧,我们可以实现元素的动画缓动,本文将分享浏览器中功能强大的AnimationsAPI,有兴趣的朋友请接着往下看吧介绍WebAnimationsAPI(简称WAAPI)于2016年成为Web标准的一部分,它的功能比之前提到的动画要丰富的多,它的核心理念是时间轴和动画效果。它提供了一组功能强大的方法和属性,用于定义、操作和管理动画效

前端动画库GSAP 入门学习详解

简介:GSAP的全名是GreenSockAnimationPlatform一直发展到今天已经是3.x版本,这是一个适用于现代浏览器的专业Javascript动画库超过1100万个网站,其中包括超过50%的获奖网站!主要品牌都使用GSAP 官网地址如下:GSAP3IsAvailableNow!-Blog-GreenSockVue里面基于侦听器的动画,也是借助于GSAP。GSAP优点:疯狂的快异常的强大兼容性好······缺点:动画过多GSAP基本使用官网地址:https://greensock.com/gsap/文档地址:https://greensock.com/get-started/核心语

前端传输加密的意义和实现

最近因为做项目的原因,涉及到登录注册的密码安全问题,于是在网上搜了一圈,然后在知乎上看到一个很热的贴子。有说没意义的,也有说有意义的。整体看下来,说无意义的,无非说是对于后端而言,前端直接发送明文密码,还是使用md5,decypt,sha等加密的密文密码,从数据层面来讲,都是『明文』,只要被劫持,就算是密文,也并不需要去破解,直接伪造请求,照样发送就好了。再加上,因为前端代码是运行在用户本地浏览器,什么加密算法都是用户可见的,混淆,散列,加密无非是增大这种可见的难道,根本上并没有解决问题。说有意义的呢,更多说的是保护用户隐私,不至于明文在网络上传输,可以防止同密码跨站使用,不在后台日志明文记录

前端实习day35

今天是下早班的一天,下完班直接赶车回广州了,吐槽一下深圳站管理得真得差,候车厅小,人巨多,而且进站口的标识也很少,绕了好久才找到!下次再也不去了。今天是改bug的一天,但是有半天后端接口都不难用,所以就在刷掘金文章,学习学习技术,下面是一些总结资料:1.vue2和vue3中watch、computed、mounted的执行顺序:在Vue2和Vue3中,watch、computed和mounted的执行顺序是不同的。在Vue2中,首先会执行computed属性的计算,然后执行watch监听器的回调函数。最后,在组件实例被挂载到DOM后,会执行mounted钩子函数。而在Vue3中,执行顺序有所改

这里推荐几个前端动画效果网站

1.AnimistaAnimista是一个CSS动画/转场库和在线工具。它有许多现成的CSS动画片段可以直接使用,也可以在线定制动画。网站地址:Animista-On-DemandCSSAnimationsLibrary 2.Animate.cssAnimate.css是一个免费的CSS动画库,里面有AttentionSeekers、BouncingEntrances、FadingEntrances、RotatingEntrances等多种动画类型和效果。网站地址:Animate.css|Across-browserlibraryofCSSanimations. 3.FramerMotionF

前端jQuery和原生js 实现下拉框select模糊搜索功能总结

方法一:jQuery实现搜索html部分DOCTYPEhtml>htmllang="zh_cn">head>title>select.suggesttitle>metaname="viewport"content="width=device-width,initial-scale=1.0"/>scriptsrc="./jquery.js"type="text/javascript">script>head>body>h2>Hello,world!h2>div>div>div>inputid="testInput"name="testInput"type="text"placeholder="请

【开发必备】推荐几个非常好用的前端VsCode插件,快来看看你都用过哪些?

VSCode是前端开发的武器,下面给大家推荐几个必备的、非常好用的前端VsCode插件1.BetterAlignBetterAlign就是一款能够实现代码规范的工具,它主要用于代码的上下对齐。它能够用冒号(:)、赋值(=,+,-=,*=,/=)和箭头(=>)对齐代码。2.BracketPairColorizer它的主要功能是为代码中的括号或者其他符号配对的符号添加不同的颜色,以便于开发者更好地区分不同的代码块。当点击对应括号时能够用线段直接链接到一起,让层次结构一目了然。除此之外,它还支持用户自定义符号。3.npmIntellisense它的作用是自动补全npm模块的名称、版本号、文件路径等信

前端开发者常用的图标库

转载自2021年,这5个前端开发者常用的图标库网站建议收藏里面引用格式的内容是自己补充。在过去的十年里,网络和移动应用已经成为我们日常生活的一部分。如今,我们可以找到很多解决同一问题的应用程序。因此,应用程序的功能显然不再是唯一的区别。为用户提供良好的整体体验对这些应用程序的成功起着重要作用。为了实现这一点,我们还需要更好的用户界面(UI)。作为开发人员,我们必须确保应用程序的外观和视感符合更高的标准,以便吸引新用户并保留现有用户。我希望这些事实能让你相信UI设计的重要性。谈到UI设计,我们使用的图标体现了它的个性。图标库图标或许很小,但即便是没有一个单词文本的图标,也能给用户提供强有力的信息

前端代理解决跨域问题

涉及知识点1.前端代理:解决跨域的问题1.1了解跨域代理:https://segmentfault.com/a/1190000010719058跨域是由浏览器同源策略引起的,是指页面请求的接口地址,必须与页面url地址处于同域上(即域名,端口,协议相同)。这是为了防止某域名下的接口被其他域名下的网页非法调用,是浏览器对JavaScript施加的安全限制。(由于页面开发中,静态资源是放在本地电脑上,访问这些资源通常通过ip方式(127.0.0.1)或者是localhosts来访问,与线上服务器所在的域名不符,不能顺利进行接口调用。)解决跨域问题常用的解决方案有两个:jsonp:利用script标

nginx部署前端项目后刷新浏览器报错404

问题: Vue项目打包部署Nginx服务器后,刷新页面后出现404的问题。原因: 加载单页应用后路由改变均由浏览器处理,而刷新时将会请求当前的链接,而Nginx无法找到对应的页面。解决:在Nginx配置文件nginx.conf中加入如下配置: try_files$uri$uri//index.html;#变量解释try_files 固定语法$uri   指代home文件(ip地址后面的路径,假如是127.0.0.1/index/a.png,那就指代index/a.png)$uri/   指代home文件夹/index.html 向ip/index.html地址发起请求 try_files$ur