标签:句柄 anim -- node remove height on() lse set
//animate效果封装 // animation(".Odiv", "bounceInUp animated"); function animations(node,result,num) { // node 节点名 // animated效果 var pageHeight, rollHeight, visibilityHeight = 0; // pageHeight 浏览器高度---screen.height // rollHeight 内容页被卷去的高度---scrollTop // visibility 当前节点所在位置---offset().top pageHeight = window.screen.height / 2 + num; visibilityHeight = $(node).offset().top; // console.log(pageHeight); // console.log(visibilityHeight+"---offset"); // window.onscroll = function (e) { // var e = e || window.event; //window.onscroll 只能调用一次 //使用 $(window).scroll(function(){ 完美解决 $(window).scroll(function(){ rollHeight = document.documentElement.scrollTop || document.body.scrollTop; // console.log(rollHeight+"---scrollTop"); if (rollHeight > visibilityHeight - pageHeight) { $(node) .css({ opacity: "1" }) .addClass(result); } if(rollHeight < visibilityHeight - (pageHeight+num)){ $(node).css({ opacity: "0" }).removeClass(result); //低于浏览器删除动画效果并消失等待下一次添加 } }); }
//或者用这种方法也可以避免 window.onscroll 只调用一次
addEvent(window, ‘scroll‘, function () {
console.log(33)
});
function addEvent(obj, type, fn) {
if (obj.attachEvent) { //ie用来绑定脚本事件
obj.attachEvent(‘on‘ + type, function () {
fn.call(obj);
})
} else {
obj.addEventListener(type, fn, true);
//向指定元素添加事件句柄
//三个参数 event function useCapture
// event 必须 字符串 指定事件名
// function 必须 指定事件触发是要执行的函数
// useCapture 可选 布尔值 指定事件是否在捕获或在冒泡阶段执行
//true 是捕获
}
}
标签:句柄 anim -- node remove height on() lse set
原文地址:https://www.cnblogs.com/fearless427/p/9765584.html