一个超轻jQuery插件，告诉一个元素是否在视口中，但有一个扭曲。
Posted
tags:
中文标题：一个超轻jQuery插件，告诉一个元素是否在视口中，但有一个扭曲。 原文标题：An ultra-light jQuery plugin that tells you if an element is in the viewport but with a twist. 项目评级：Star:652 Fork:162 下载地址：https://github.com/zeusdeux/isInViewport 详情介绍isInViewport.js中
一个超轻jQuery插件，告诉元素是否在视口中，但有一个扭曲。
你说的是演示（包括测试）吗？
要获得更高性能的替代方案，请查看使用新的IntersectionObserverAPI的observe-element-in-viewport。请记住，根据您支持的浏览器，您可能需要为IntersectionObserver提供polyfill。
注意：如果您在React应用程序中需要此功能，请使用use-is-in-viewport挂钩。
安装
在模块中使用
然后，您可以在代码中require('is-in-viewport')或import 'is-in-viewport'。
它将自动与您选择的捆扎机配合使用。如果它坏了，请随时打开一个问题。
ES6/ES2015模块中的使用示例显示在examples/es6-example文件夹中。
注：isInViewport为副作用模块。它导入您安装的jquery，并将自己连接在上面。
因此，isInViewport需要将jquery作为对等依赖项进行安装。
如果jquery未安装为is-in-viewportimportsjquery，您的捆绑将失败。
在脚本标记中直接使用
用法
基本用途
当用作选择器时，它将返回所有匹配的元素。由于它返回元素，因此可以与其他jQuery方法链接。它也可以与jquery的.is一起使用。
示例：
对于视口中的所有divs，以上两项都会将background-color设置为red。
高级使用
使用in-viewport伪选择器
这将返回视口中的所有元素，同时考虑tolerance标准。
由于它返回元素，因此可以与其他jQuery方法链接。
当指定了视口选择器时，它会使用该选择器来计算元素是否在该视口中。
如果未指定而视口选择器，则默认为窗口作为视口。
视口选择器是任何有效的jQuery选择器。
默认值：
示例：
示例1将tolerance为100px的视口中所有divs的background-color设置为red。
示例2将在viewport height - 100px的tolerance视口中的所有divs设置background-color为green。这使得用户可以方便地提供更接近视口高度的tolerance值，而不必一直调用$(viewport).height()。
示例3将#viewport给出的自定义视口中的所有divs以及100px的tolerance设置为blue和text为in viewport。
通过高级使用，可以很容易地构建菜单等内容，这些菜单中的项目会根据您所在的区域自动高亮显示，元素进入视口时的过渡效果等。
请参阅examples目录中的示例以获得更清晰的信息。
注意：
这使得开发人员更容易将整个viewport作为有效的＜1240〉提供给他们。
使用暴露isInViewport功能
这将返回视口中的所有元素，同时考虑tolerance标准。
由于它返回元素，因此可以与其他jQuery方法链接。
指定视口时，它会使用该视口来计算元素是否在该视口中。
如果未指定视口，则默认为窗口作为视口。
视口是有效的DOM元素或jQuery包装的DOM元素，而不是选择器字符串。
默认值：
示例：
支持
Chrome、Firefox 3.5+、IE9+、Safari 5+、Opera 10.5+
笔记
变更日志
3.0.3
3.0.2
3.0.1
3.0.0
2.4.2
2.4.1
2.4.0
2.3.1
2.3.0
2.2.5
2.2.4
2.2.3
2.2.2
2.2.1
2.2.0
2.1.0
2.0.0
1.1.1
1.1.0
一个超轻量级、高度可配置的跨浏览器日期时间选择器jQuery插件
jQuery + One Page Scroll 插件：检查元素 hasClass 是不是不起作用