javascript - 如何仅在 DIV 可见时运行脚本?

标签 javascript jquery

我有一个我写的脚本:

jQuery(function($) {
        $('.count').countTo({
            from: 0,
            to: '400',
            speed: '3000',
            refreshInterval: 50,
            onComplete: function(value) {
                console.debug(this);
            }
        });
    });

我只需要在容器 div 可见时运行该脚本。

<div class="container">
   <div class="count"></div>
</div>

澄清一下,div 将始终可见,但当用户将其滚动查看时。有什么想法吗?

http://www.windycitydigital.net/iconvert/ - 例如,在页面底部,这些计数器自动启动。我不希望在用户滚动到它们的 View 之前启动该脚本。

最佳答案

以下是仅当 #mydiv 处于 View 中时才激活警报的示例: 这按照你的要求工作。确保窗口很小,这样 #midiv 从一开始就不会出现在 View 中。向下滚动后,整个 #mydiv 可见后,它将激活滚动事件的警报。

http://jsfiddle.net/u3eCG/7/

divScroll = $("#mydiv").offset().top + $("#mydiv").height();

$(window).scroll(function(){
   lastLineScroll = $("body").scrollTop() + $(window).height();
   if (divScroll < lastLineScroll)  {
                     alert("Div is visible");
                     $(window).unbind("scroll");
   }
});

关于javascript - 如何仅在 DIV 可见时运行脚本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22288130/

相关文章:

javascript - 如果鼠标不移动,输入中的 OnChange 不会触发

javascript - ASP .NET 打印 iFrame

javascript - 如果选择了另一个选项,如何取消选择来自 Array 的选项

javascript - 如何从 PHP 中的 URL 获取参数但在 jQuery 加载页面之后?

jquery - jqgrid更改列标题属性

javascript - knockout 不渲染

javascript - 如何使 AJAX 回调触发另一个 AJAX 调用?

javascript - 无法获取 json 中的 js 数组

javascript - 如何将选择框的文本显示到文本框?

javascript - 从任何类型的网址中提取域名