angular之上滑换页指令
healthmallDirectives.directive("goodsTopRefresh", ['$window',function ($window) {
return {
link: function (scope,el,attrs) {
var wai = $window.document.getElementById("outerDiv");
var content = $window.document.getElementById("goodsnei")
wai.addEventListener("scroll", function (e) {
var waiHeight = wai.offsetHeight;
var contentHeight = content.offsetHeight;
var waiTop = wai.scrollTop;
if(waiTop+ waiHeight-40 >= contentHeight){
var startY;
var endY;
content.addEventListener("touchstart", function (e){
startY = e.changedTouches[0].pageY;
});
content.addEventListener("touchend", function (e){
endY= e.changedTouches[0].pageY;
if(startY -endY>=80){
scope.$apply(attrs.toptorefresh);
}
});
}
})
}
};
}]);
获得滚动页的大小和内容页大小,通过touchStart和touchEnd判断页面是否是上滑,若上滑则执行toptorefresh属性中的方法
angular之上滑换页指令的更多相关文章
- 推荐 15 个 Angular.js 应用扩展指令(参考应用)
几天前我们看到Angular 1.4.0发布了-一个以社团为驱动的发布版本涵盖了400多个GitHub的提交,增加了对特性的提升,比如动画,以及可用性. 官方新闻发布稿 覆盖了绝大部分,这同样值得放于 ...
- Angular JS学习之指令
1.Angular JS通过称为指令的新属性来扩展HTML:通过内置的指令来为应用添加功能: 2.AngularJS指令:AngularJS指令是扩展的HTML属性,带有前缀ng-: **ng-app ...
- Angular使用操作事件指令ng-click传多个参数示例
本文实例讲述了Angular使用操作事件指令ng-click传多个参数功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html ng-app="m ...
- ANGULAR 开发用户选择器指令
在开发表单时,我们需要使用经常需要使用到用户选择器,用户的数据一般使用如下方式存储: 用户1,用户2,用户3 我们可以使用angular指令实现选择器. <!DOCTYPE html> ...
- angular中的ng-bind-html指令和$sce服务
angular js的强大之处之一就是他的数据双向绑定这一牛B功能,我们会常常用到的两个东西就是ng-bind和针对form的ng-model.但在我们的项目当中会遇到这样的情况,后台返回的数据中带有 ...
- Angular.js之自定义指令学习笔记
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- angular : direative :comunication 指令之间的通讯
在网络上可以找到多种指令之间的通讯 · $on,$emit,$boardcast (向上或向下冒泡) · 指令return的required (^)向上一个scope通讯,前提要先给scope一个na ...
- Angular回到顶部按钮指令
之前的分页代码指令化在线下测试没有问题,到服务器上就不运行了,所以那个先放一放. 今天来把"回到顶部"按钮指令化.首先是页面html: <!--回弹按钮--> < ...
- angular.js的ng-app 指令定义一个 AngularJS 应用程序。
<!DOCTYPE html> <html lang="en" ng-app> <head> <meta charset="UT ...
随机推荐
- 高可用mysql之MHA源码剖析
* MHA的整个故障(离线)切换过程 - 检测主库的状态,确认是否崩溃. - 确认服务崩溃,保存binlog,推送到主控机,并可以强制关闭主库避免脑裂. - 找出数据最新的从库(也就是read_mas ...
- .NET中的异步
.NET中4种异步方式? ThreadPool.QueueUserworkItem实现 APM模式(就是BeginXXX和EndXXX成对出现.) EAP模式(就是Event based, 准确说来就 ...
- SQL Server中查询数据库及表的信息语句
/* -- 本文件主要是汇总了 Microsoft SQL Server 中有关数据库与表的相关信息查询语句. -- 下面的查询语句中一般给出两种查询方法, -- A方法访问系统表,适应于SQL 20 ...
- Jquery制作--焦点图左右轮播
公司项目经常用到轮播焦点图,于是自己写了一个纯jq形式的横向轮播焦点图,可点击小圆点或者左右按钮进行切换,属于定宽类型.改成自适应宽度的也不难,将css里面的bannerCon宽度改为百分比,再在js ...
- python 2.7 学习笔记--文件的基本操作
1.打开文件的方式 file_obj = file("文件路径","模式") file_obj = open("文件路径","模式 ...
- spring mvc controller间跳转 重定向 传参
http://blog.csdn.net/jackpk/article/details/19121777/
- HTML CSS 特殊字符表(转载)
转载地址:http://blog.csdn.net/bluestarf/article/details/40652011 转载原文地址:http://zhengmifan.com/news/noteb ...
- angularJS绑定数据时自动转义html标签
angularJS在进行数据绑定时默认是会以文本的形式输出,也就是对你数据中的html标签不进行转义照单全收,这样提高了安全性,防止了html标签中的注入攻击,但有些时候还是需要的,特别是从数据库读取 ...
- 1.Two Sum(c++)(附6ms O(n) accepted 思路和代码)
问题描述: Given an array of integers, return indices of the two numbers such that they add up to a speci ...
- CentOS 7 Git安装
Git安装 yum -y install git 安装后,在srv目录下建立Git的目录. 初始化一个git空仓库 git init --bare project.git 增加用于访问git仓库的用户 ...