详解jquery插件jquery.viewport.js学习使用方法

　　

<强> & # 65279;介绍
　　

　　

窗口是一个简单的jQuery插件,为元素添加自定义伪选择器和处理程序,以便在可视窗口内外进行简单的元素检测。

　　

<强>使用方法
　　

　　 　　 　　& lt;脚本src=" https://www.yisu.com/zixun/jquery.js " type=" text/javascript祝辞& lt;/script> 　　& lt;脚本src=" https://www.yisu.com/zixun/jquery.viewport.js " type=" text/javascript祝辞& lt;/script> 　　之前 　　 　　

<强>方法
　　

　　 　　 　　$ (":in-viewport "); 　　$ (":above-the-viewport "); 　　$ (":below-the-viewport "); 　　$ (":left-of-viewport "); 　　$ (":right-of-viewport "); 　　$ (":partly-above-the-viewport "); 　　$ (":partly-below-the-viewport "); 　　$ (":partly-left-of-viewport "); 　　$ (":partly-right-of-viewport "); 　　$ (":have-scroll "); 　　 　　

<>强实例
　　

　　

黄色部分离开屏幕后显示返回按钮

　　

详解jquery插件jquery.viewport.js学习使用方法

　　

详解jquery插件jquery.viewport.js学习使用方法

　　 　　 　　var wodBackButton=function () {//元素在屏幕左侧显示返回按钮 　　$ (" # wodsHome: left-of-screen”)。每个(函数(){ 　　$ (' # wodBackButton ') .removeClass(隐藏的); 　　返回; 　　})；//元素在屏幕显示区域隐藏返回按钮 　　$ (" # wodsHome: in-viewport”)。每个(函数(){ 　　$ (' # wodBackButton ') .addClass(隐藏的); 　　返回; 　　})； 　　} 　　 　　$ (" # mediaContainer”)。绑定(“滚动”,函数(事件){ 　　wodBackButton (); 　　})； 　　 　　wodBackButton (); 　　之前 　　 　　

<强>总结
　　

　　

通过使用这个插件能很简单方便的获取屏幕的区域,屏幕以外的区域,进行开发。

　　

github地址
　　

　　

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

详解jquery插件jquery.viewport.js学习使用方法