首页
学习
活动
专区
圈层
工具
发布
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    医疗数字阅片-医学影像-Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库。_.throttle(func, , [option

    例子 // 避免在滚动时过分的更新定位 jQuery(window).on('scroll', _.throttle(updatePosition, 100)); // 点击后就调用 `renewToken...新的 maxWait 选项(仅 Lodash 有)本文未提及,但是也很有用。事实上,throttle 方法是用 _.debounce 加 maxWait 实现的,你可以看 lodash 源码。...相似的使用场景还有,直到用户输完,才验证输入的正确性,显示错误信息。...可以使用 rAF API 替换 throttle 方法,考虑一下优缺点: 优点 动画保持 60fps(每一帧 16 ms),浏览器内部决定渲染的最佳时机 简洁标准的 API,后期维护成本低 缺点 动画的开始...throttle:保证每 X 毫秒恒定的执行次数,比如每200ms检查下滚动位置,并触发 CSS 动画。

    3.4K20

    前端常用插件

    的语法 js-sequence-diagrams: 另一款可以根据文本生成流程图的库,类似于 Markdown 的语法 flow: 一个用来检测 Javascript 语法错误的库, Facebook...: smartbanner 是从 IOS6 开始支持的一个新特性, 这个插件提供了对早期 IOS4/5 和 Android 的支持 jquery.scrollTo: 在页面上以一个元素为起始以动画的方式移动...,兼容到 IE8 scrollMonitor: 前端插件用来监控元素的滚动事件(进入、退出等),性能很好 ScrollMagic: 神奇的滚动交互效果插件,可以在滚动的过程中设置各种各样的动态效果 infinite-scroll...: jQuery 动画库的一个增强,用于现代浏览器 wysihtml: 富文本编辑器,适用于现代浏览器 slip: 一个通过滑动或者拖拽来操控列表的库 evil-icons: 一个矢量图库,提供 Ruby...scrollReveal.js: 使元素以非常酷帅的方式进入画布 (Viewpoint),看 Demo Modernizr: 一个用来检测 HTML5 和 CSS3 支持情况的库 foundation

    6.6K61

    gsap

    构建适用于所有主要浏览器的高性能动画。动画 CSS、SVG、canvas、React、Vue、WebGL、颜色、字符串、运动路径、通用对象…任何 JavaScript 可以触及的内容!...GSAP 的ScrollTrigger插件以最少的代码提供令人惊叹的基于滚动的动画。 gsap.matchMedia()使构建响应式、易于访问的动画变得轻而易举。...GSAP 解决了无数浏览器不一致的问题;你的动画就可以了。从本质上讲,GSAP 是一个高速属性操纵器,可以随着时间的推移以极高的精度更新值。它比 jQuery 快 20 倍!...有许多可选插件和缓动功能可以轻松实现高级效果,例如滚动、变形、沿运动路径制作动画或翻转动画。甚至还有一个方便的观察者来规范跨浏览器/设备的事件检测。...end: "top 30%", // 结束触发的滚动位置 scrub: 1, // 动画随滚动条同步(值越大同步越平滑) markers: true,

    91410

    16个超实用的jQuery技巧攻略

    本文我们将为jQuery用户分享8个超实用的技巧攻略。jQuery是JavaScript最好的库之一,主要用于制作动画、事件处理,支持Ajax及HTML 脚本客户端。...click(function() { //scoll the page back to the top $(document).scrollTo(0,500); } }); 平滑滚动到锚点...Position = " + e.pageX + " and Y Axis Position = " + e.pageY); }); }); 8)缩放图片 虽然图片应该在服务器端缩放,不过如果服务器端未做缩放...很多网站使用了流行的瀑布图布局,这种类型的网站在页面滚动的时候会自动加载内容。...在表单功能中,经常会有检测用户输入的密码强度的功能,下面这个代码片段使用正则表达式来检测密码是否足够安全,当然记得在服务端也进行表单验证。

    1.7K30

    前端插件以及部分细分网址梳理

    : 一个用于模拟人输入状态的 JS 库 stellar.js: 前端用于实现异步滚动效果的库,现已不再维护 skrollr: 另一款实现一步滚动的开源库,使用人数众多,可实现各种狂拽酷炫掉渣天的前端效果...: smartbanner 是从 IOS6 开始支持的一个新特性, 这个插件提供了对早期 IOS4/5 和 Android 的支持 jquery.scrollTo: 在页面上以一个元素为起始以动画的方式移动...,兼容到 IE8 scrollMonitor: 前端插件用来监控元素的滚动事件(进入、退出等),性能很好 ScrollMagic: 神奇的滚动交互效果插件,可以在滚动的过程中设置各种各样的动态效果 infinite-scroll...: 滚动加载,滚动到最下到自动加载, Paul Irish 大神之作 animatable: 仅仅依靠 border-width 和 background-position 实现的各种动态效果,看真相...: jQuery 动画库的一个增强,用于现代浏览器 wysihtml: 富文本编辑器,适用于现代浏览器 slip: 一个通过滑动或者拖拽来操控列表的库 evil-icons: 一个矢量图库,提供 Ruby

    7.5K90

    jquery第一次课的案例教程

    ) 关于压缩版和未压缩版: jquery-1.12.4.min.js:压缩版本,适用于生产环境,因为文件比较小,去除了注释、换行、空格等东西,但是基本没有颗阅读性。...jquery-1.12.4.js:未压缩版本,适用于学习与开发环境,源码清晰,易阅读。.../获取可视区宽度 $(window).width(); //获取可视区高度 $(window).height(); scrollTop与scrollLeft 设置或者获取垂直滚动条的位置...//screenX和screenY 对应屏幕最左上角的值 //clientX和clientY 距离页面左上角的位置(忽视滚动条) //pageX和pageY 距离页面最顶部的左上角的位置...(会计算滚动条的距离) //event.keyCode 按下的键盘代码 //event.data 存储绑定事件时传递的附加数据 //event.stopPropagation

    1.4K10

    06-移动端开发教程-fullpage框架

    CSS3的新特性已经讲完了,接下来我们看一下jQuery的一个全屏jQuery全屏滚动插件fullPage.js。...支持css3动画。 支持窗口缩放。 窗口缩放时自动调整。 可设置滚动宽度,背景颜色,滚动速度,循环选项,回调,文本对齐方式等。...,单位为毫秒 easing 字符串 easeInQuart 滚动动画方式 menu 布尔值 false 绑定菜单,设定的相关属性与 anchors 的值对应后,菜单可以控制滚动 navigation 布尔值...配合animate.css的问题,animate的动画添加上animated样式和具体的动画类型才会具有动画效果。如果一开始全设置好了那么只有第一屏有动画效果,不是我们想要的结果。...配合fullpage的onLeave事件,可以实现在上一屏离开的时候,给下一屏添加动画样式类,并把上一屏的动画样式类去掉。动画样式类可以提前记录在一个数组中或者是放到动画元素的自定义属性中。

    7.4K50

    耗时函数被短时间频繁调用时,防浏览器卡死的方法

    当用户频繁的修改输入内容,那边就会导致未执行的查询函数的堆积。我们只需要查询最近用户输入的,堆积的函数不需要被执行。 做法是,每次要执行查询方法时,将之前没执行的那个查询方法取消执行。.../asset/vendor/jquery-2.1.3.min.js"> $(document).ready(function() { function throttle...其他使用场景还有:滚动条滚动的处理函数。 对于第二类,函数每次都要被执行。可能的场景是:要做活动的签到图片墙功能。...在一个时间点,可能有一大堆人来签到,而显示每次签到时,会有一个动画,而显示的设备的性能比较差时,如果同时做很多个动画,会导致显示的卡顿。我们可以执行签到动画之间加一些时间间隔。.../asset/vendor/jquery-2.1.3.min.js"> $(document).ready(function() {

    1.1K30

    为什么要学jquery

    ) 关于压缩版和未压缩版: jquery-1.12.4.min.js:压缩版本,适用于生产环境,因为文件比较小,去除了注释、换行、空格等东西,但是基本没有颗阅读性。...jquery-1.12.4.js:未压缩版本,适用于学习与开发环境,源码清晰,易阅读。...获取可视区宽度 $(window).width(); //获取可视区高度 $(window).height(); scrollTop与scrollLeft 设置或者获取垂直滚动条的位置...//screenX和screenY 对应屏幕最左上角的值 //clientX和clientY 距离页面左上角的位置(忽视滚动条) //pageX和pageY 距离页面最顶部的左上角的位置...(会计算滚动条的距离) //event.keyCode 按下的键盘代码 //event.data 存储绑定事件时传递的附加数据 //event.stopPropagation

    3.3K10

    前端组件整理

    该组件依赖Twitter Bootstrap, Moment.js和jQuery. 自定义滚动条 perfect scrollbar 轻量级的滚动条。外观与mac上chrome的滚动条一样。...动画效果 jQuery.Marquee 跑马灯效果 quickflip 卡片翻转效果 卡片翻转效果2 兼容性可以。写的比较简单:1,只支持x方向翻转 2,类名都是规定好的 3,只能被调用一次。...我的改进版见这里 TheaterJS 模拟两个人在屏幕上对话 midnight.js 文字颜色随着背景变,屌炸了 color-animation jquery的颜色渐变动画插件。...jquery的动画不支持颜色值的变化。改库提供了这个支持。...scrolldeck flash swfobj 能够自动检测PC、Mac机器上各种主流浏览器对Flash插件的支持情况。它使得插入Flash媒体资源尽量简捷、安全。

    15K40

    06-移动端开发教程-fullpage框架

    CSS3的新特性已经讲完了,接下来我们看一下jQuery的一个全屏jQuery全屏滚动插件fullPage.js。...支持css3动画。 支持窗口缩放。 窗口缩放时自动调整。 可设置滚动宽度,背景颜色,滚动速度,循环选项,回调,文本对齐方式等。...,单位为毫秒 easing 字符串 easeInQuart 滚动动画方式 menu 布尔值 false 绑定菜单,设定的相关属性与 anchors 的值对应后,菜单可以控制滚动 navigation 布尔值...配合animate.css的问题,animate的动画添加上animated样式和具体的动画类型才会具有动画效果。如果一开始全设置好了那么只有第一屏有动画效果,不是我们想要的结果。...配合fullpage的onLeave事件,可以实现在上一屏离开的时候,给下一屏添加动画样式类,并把上一屏的动画样式类去掉。动画样式类可以提前记录在一个数组中或者是放到动画元素的自定义属性中。

    7.6K90

    CSS vs JS动画:谁更快?

    jQuery 让我们从基本开始说起: Javascript 和 jQuery 两者不能混为一谈。Javascript 动画很快,而 jQuery 动画很慢。为什么呢?...jQuery的内存消耗较大,经常会触发垃圾回收。而垃圾回收触发时很容易让动画卡住。...更新 */ element.style.left = currentLeft + 1; /* 更新 */ 在更新操作之后的访问操作会强制浏览器重新计算页面元素的样式(因为要将更新的样式应用上去才能获取正确的值...相反的,Velocity 在 zip 压缩之后只有 7kb,它不仅仅实现了 jQuery animate 方法的所有功能,还包含了 颜色、transforms、loop、easings、class 动画和滚动动画等功能...在结束之前,请记住一个高性能的 UI 绝不仅仅是选择一个正确的动画库。页面上的其他代码也需要优化。

    3.1K20

    那些前端常用的网站插件

    实现动画过渡的 jQuery 插件 Barba.js — 流式页面过渡 TwentyTwenty — 一个对比图片的可视化 diff 工具 Vivus.js — 在 SVG 上绘制动画 Wow.js ...— 滚动时展现动画 Scrolline.js — 页面滚动时显示滚动进度 Velocity.js — 快速流畅的 JavaScript 动画 Animate on scroll — 漂亮的页面滚动元素动画...Typeahead.js — 搜索补全 Dragdealer.js — 炫酷拖拽 Bounce.js — 创建炫酷的 CSS3 动画 Pagepiling.js — 全屏滚动 Multiscroll.js... — 两列垂直反向滚动 Favico.js — 动态 favicon Midnight.js — 固定头部切换效果 Anime.js — 动画库 Keycode — 获取键盘按键的 JavaScript... — 使用固定定位来创建相关元素 Shepherd.js — 为应用创建新手引导 Tooltip — tooltip 提示框 Select2 — Jquery 选择框插件 IziToast — 通知弹窗实现

    5.9K50

    awesome-javascript-cn

    官网 jquery.rest:一个让 RESTful API 更易使用的 jQuery 插件。官网 视觉检测 tracking.js:在 web 上实现计算视觉的一种现代方法。...不依赖 jQuery。官网 PageLoadingEffects:使用 SVG 动画展现新内容的现代方式。官网 SpinKit:运用 CSS 动画的加载指示器集合。...官网 jcSlider:用 CSS 动画实现的响应式幻灯片 jQuery 插件。官网 basic-jquery-slider:易于使用、指定主题和定制化。...官网 stellar.js:让视差滚动变简单。官网 plax:基于 jQuery 的视差库。官网 jparallax:创建可交互视差效果的 jQuery 插件。...官网 动画 velocity:加速 JavaScript 动画。官网 jquery.transit:拥有超级流畅的 CSS3 变换和过渡的 jQuery 插件。

    13.5K80

    2019年最全的web前端知识体系汇总

    实现动画过渡的 jQuery 插件 · Barba.js—流式页面过渡 · TwentyTwenty—一个对比图片的可视化 diff 工具 · Vivus.js—在 SVG 上绘制动画 · Wow.js...—滚动时展现动画 · Scrolline.js—页面滚动时显示滚动进度 · Velocity.js—快速流畅的 JavaScript 动画 · Animate on scroll—漂亮的页面滚动元素动画...· Handlebars.js—Javascript 模板 · jInvertScroll—视差滚动 · One page scroll—又一个页面滚动库 · Parallax.js—对智能设备方向变化做出响应的视差引擎...· Typeahead.js—搜索补全 · Dragdealer.js—炫酷拖拽 · Bounce.js—创建炫酷的 CSS3 动画 · Pagepiling.js—全屏滚动 · Multiscroll.js...—两列垂直反向滚动 · Favico.js—动态 favicon · Midnight.js—固定头部切换效果 · Anime.js—动画库 · Keycode—获取键盘按键的 JavaScriptkeycode

    4.1K00
    领券