首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >当元素进入窗口执行函数的视线时

问当元素进入窗口执行函数的视线时
EN

Stack Overflow用户
提问于 2010-03-23 04:47:34
回答 2查看 944关注 0票数 1

当我向下滚动时,当元素出现在窗口中时,我如何在元素上执行函数?

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2010-03-23 05:02:47

我不妨把它贴在这里作为一个答案:

代码语言:javascript
复制
function elementInView($elem, vps, vpe) {
    var elempos = $elem.position(); 
    var pagestart = elempos.top + vps;
    var pageend = elempos.top + vps + $elem.height();
    var offset = $elem.height() - Math.max(0,vps-pagestart) - Math.max(0,pageend-vpe);    
    return (vpe > 0 && offset > -200); 
}

$('#container').bind('scroll', function() {
    var $container = $(this);
    var vps = $container.scrollTop();
    var vpe = vps + $container.height();

    $('li', '#container').each(function() {
        var $this = $(this);
        if (elementInView($this,vps,vpe)) {
            // $this is now in view
        }
    });
});

我知道这有一些性能问题,可以优化,但这应该是一个开始。

票数 1
EN

Stack Overflow用户

发布于 2010-03-23 04:57:21

代码语言:javascript
复制
function isScrolledIntoView(elem)
{
    var docViewTop = $(window).scrollTop();
    var docViewBottom = docViewTop + $(window).height();

    var elemTop = $(elem).offset().top;
    var elemBottom = elemTop + $(elem).height();

    return ((elemBottom >= docViewTop) && (elemTop <= docViewBottom));
}

via https://stackoverflow.com/questions/487073/jquery-check-if-element-is-visible-after-scroling

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/2495615

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档