强制IntersectionObserver更新

文章/答案/技术大牛

发布

4回答

javascript、intersection-observer

有没有办法强制更新/运行IntersectionObserver实例？默认情况下，当视口已更改时，将执行回调。但我正在寻找一种在其他事件发生时执行它的方法，比如元素的更改。; let options = {root: document.querySelector('#container')};le

浏览 32提问于2018-07-18得票数 21

1回答

如何使用IntersectionObserver初步检查元素是否相交

javascript、observers、intersection-observer

目标：--我想为一组元素执行一个操作，这些元素在页面加载时相交，并单独处理所有其他元素(这些元素目前尚未相交)。可能的解决方案：，如果最初可以询问交叉观察者是否元素是相交的。据我所知，没有这样的功能，所以每一个想法或帮助都会受到赞赏。

浏览 4提问于2020-08-21得票数 4

回答已采纳

3回答

引用错误:找不到变量: IntersectionObserver

ios13、intersection-observer、cordova-8.0.0

我正在尝试在iOS13上运行的cordova 8.0.0应用程序中使用IntersectionObserver。当我通过safari检查我的应用程序时，我看到一个初始化错误：这表明IntersectionObserver我读过很多文章，声称iOS safari 12+本身就支持IntersectionObserver。我发现我已经在我的safari实验功能中启用了IntersectionO

浏览 2提问于2019-11-28得票数 5

4回答

确定元素覆盖了多少视区(IntersectionObserver)

javascript、intersection-observer

当元素进入视口时，我使用IntersectionObserver向元素添加和删除类。如果是这样的话，我认为这是IntersectionObserver的一个缺陷，因为如果您有一个比视图高10倍的元素，那么它将永远不会被计算为可见，除非您将阈值设置为10%或更低。Edit2:使用几个阈值进行更新，以强制它更频繁地计算percentOfViewport。还是不理想。 entries.f

浏览 0提问于2019-09-04得票数 8

回答已采纳

6回答

Jest使用react-intersection-observer测试react组件

javascript、reactjs、jestjs

main-input"); }); 我收到此错误，未捕获ReferenceError:未定义IntersectionObserver有没有办法让我模仿IntersectionObserver？

浏览 89提问于2019-07-12得票数 10

回答已采纳

1回答

角度中的相交观测器

javascript、angular、typescript

我正在尝试在Angular中设置IntersectionObserver，但是我不能让它工作。当我从服务器使用HttpClient向下滚动时，我想加载数据。@Injectable({}) _observer: IntersectionObserver_observer = new IntersectionObserver((entries, observer) => {

浏览 12提问于2021-04-27得票数 2

回答已采纳

1回答

IntersectionObserver和位置:绝对

javascript、css-position、intersection-observer

当观察到的元素具有position: absolute并且根不是视口时，IntersectionObserver似乎不起作用。我是不是漏掉了什么？= document.getElementById("observedElement"); (entries, observer) => {

浏览 23提问于2021-01-15得票数 1

回答已采纳

2回答

是否有可能避免useCallback自定义React上的“eslint(deps钩子/详尽-deps)”错误？

reactjs、react-hooks、eslint

使用以下自定义的React与IntersectionObserver进行交互 const intersectionObserver= useRef<Intersectio

浏览 3提问于2020-08-12得票数 0

1回答

如何在Inertia.js中操作浏览器url？

laravel、vue.js、routes、vuejs3、inertiajs

我一直在使用IntersectionObserver来更新我的SPA的url，而用户则按如下方式滚动页面：const options = {} const observer = new IntersectionObserver((entries, observer

浏览 5提问于2022-05-02得票数 0

1回答

IntersectionObserver in React.useEffect

javascript、reactjs、observable

我正在尝试使用top从多个元素获取IntersectionObserver和bottom度量。然而，一旦我有了测量，我如何才能unobserve元素。const observer = new IntersectionObserver((entries) => { const

浏览 3提问于2021-05-25得票数 2

回答已采纳

1回答

为什么在函数调用完成后在函数中创建的IntersectionObservers继续工作？

javascript、intersection-observer

通过阅读Mozilla对IntersectionObserver的解释，我遇到了，这是IntersectionObserver的一个示例用例的一部分。本文创建IntersectionObserver的方式在我正在处理的项目的代码上下文中运行得很好，但我对IntersectionObserver如何继续工作感到有点困惑，尽管用于存储IntersectionObserver函数调用结束时，不应该将IntersectionObserver与observer变量一起垃圾收集吗？在我自己的代码中

浏览 4提问于2021-11-21得票数 0

1回答

在Angular组件中测试IntersectionObserver

angular、jasmine、intersection-observer

当用户滚动到页面底部时，我使用IntersectionObserver加载数据。: IntersectionObserver; this.observer= new IntersectionObserver(([entry]) => { },我认为我必须使用间

浏览 13提问于2020-08-26得票数 0

2回答

在useEffect钩子上获取无限循环

javascript、reactjs、react-hooks

正在尝试生成工具提示组件。当工具提示从视口移开时，需要切换工作正常的工具提示位置。但是当工具提示远离视口时，useEffect会无限运行。找不到根本原因。添加沙盒链接https://codesandbox.io/s/dbpkr

浏览 61提问于2020-12-29得票数 0

1回答

Vue设置IntersectionObserver

javascript、vue.js、vuejs2、vue-component、intersection-observer

我试图为无限滚动列表设置一个IntersectionObserver。如果已经到达列表的最后一项，我想向IntersectionObserver检查。到目前为止，我的IntersectionObserver设置如下所示： const config = { };const observer = new IntersectionObserver((entries) => { entries.forEach((entry) =&

浏览 2提问于2017-12-21得票数 2

回答已采纳

3回答

LitElement无限滚动重定位问题

javascript、infinite-scroll、lit-element、intersection-observer

该组件基于以下一个：当触发IntersectionObserver时，通过调整垫片和更新列表项内容来实现项目定位。当组件从上到下快速滚动时，它工作得很好。当您放慢滚动速度时，它有时会在达到IntersectionObserver阈值之前添加一个填充。至于从下到上滚动，无论你是快速滚动还是缓慢滚动，它都是这样的。

浏览 6提问于2020-09-24得票数 3

回答已采纳

1回答

更改导航链接样式，取决于在“响应”中哪个div在视图中。

javascript、reactjs、intersection-observer

目标:将IntersectionObserver实现到我的所有部分(从Home到联系人)，并且取决于视图中的哪个组件，ScrollNavigation组件中的活动链接将被更改(如果我从家乡滚动到音乐会，=== 'home' { } else if (IntersectionObserver.state === 'concerts' {

浏览 5提问于2022-04-03得票数 1

1回答

Javascript :仅在Safari中使用TypeError()时输入错误

javascript、typeerror、intersection-observer

我不明白为什么Safari (13.0.2)在使用TypeError: Type error时会抛出一个IntersectionObserver()。其他主流浏览器没有。DOMContentLoaded", () => { root: document,

浏览 2提问于2020-07-01得票数 0

回答已采纳

1回答

CSS滚动-快照API？

javascript、css、dom-events

我是curious...do的CSS滚动快照属性有一个API (事件)，可以通过JavaScript？我正在修补创建一个网站的想法，该网站使用滚动捕捉在100vh的“幻灯片”之间移动。在每个幻灯片完成“滚动捕捉”后，我想触发一个动画。我相信有一些巧妙的方法可以检查每个“幻灯片”，看看它是否占用了100%的视窗，但这有点糟糕。最好是在scroll事件完成后再触发一个函数。下面是一个超级简单的例子： $(document).ready(function() { let slideNumber = $('.container > .slide').length;

浏览 13提问于2019-02-21得票数 9

1回答

IntersectionObserver填充不会在IE11中加载

javascript、internet-explorer、polyfills、intersection-observer

我使用的是IntersectionObserver，如果浏览器不兼容的话，应该加载一个填充。不幸的是，在IE11中，事情并没有起作用。在控制台中，我可以看到一个IntersectionObserver未定义的错误。如果我没有加载填充料的话，我会料到的，但我应该！我检查了“网络”选项卡，似乎IE从未下载过“填充”脚本。知道为什么吗？下面是我的代码，它应该检查浏览器是否支持IntersectionObserver，如果它不支持的话，就加载它。 <script type="text/javascript">

浏览 0提问于2019-09-16得票数 3

1回答

在const IntersectionObserver中添加变量条件

javascript、reactjs、react-hooks

我在start上添加了以下钩子： (node) => { } [scrollObserver, bottomBoundaryRef]我所面临的问题是，我想要添加一个随时间更新的变量值的if (data.length <= iScrollMax) { pagerDispatch({ type:

浏览 2提问于2020-05-18得票数 1

回答已采纳

点击加载更多