Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[zh-cn] update intersection observer api #17222

Merged
merged 7 commits into from
Dec 8, 2023
Merged

[zh-cn] update intersection observer api #17222

merged 7 commits into from
Dec 8, 2023

Conversation

jasonren0403
Copy link
Contributor

Description

Motivation

Additional details

Related issues and pull requests

@github-actions github-actions bot added the l10n-zh Issues related to Chinese content. label Dec 1, 2023
jasonren0403
jasonren0403 commented Dec 1, 2023
View reviewed changes
files/zh-cn/web/api/intersection_observer_api/index.md
@@ -1,43 +1,45 @@
---
title: Intersection Observer API
title: 交叉观察器 API
Copy link
Contributor Author

@jasonren0403 jasonren0403 Dec 1, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

交叉观察器：https://www.w3.org/zh-hans/news/2017/first-public-working-draft-intersection-observer/

@jasonren0403 jasonren0403 mentioned this pull request Dec 1, 2023
Open
@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Dec 4, 2023 •
edited
Loading

Preview URLs

Flaws (12)

URL: /zh-CN/docs/Web/API/Intersection_Observer_API
Title: 交叉观察器 API
Flaw count: 12

  • macros:
    • /zh-CN/docs/Web/API/IntersectionObserverEntry/isIntersecting does not exist but fell back to /en-US/docs/Web/API/IntersectionObserverEntry/isIntersecting
    • /zh-CN/docs/Web/API/IntersectionObserverEntry/rootBounds does not exist but fell back to /en-US/docs/Web/API/IntersectionObserverEntry/rootBounds
    • /zh-CN/docs/Web/API/IntersectionObserverEntry/isIntersecting does not exist but fell back to /en-US/docs/Web/API/IntersectionObserverEntry/isIntersecting
    • /zh-CN/docs/Web/API/IntersectionObserverEntry/boundingClientRect does not exist but fell back to /en-US/docs/Web/API/IntersectionObserverEntry/boundingClientRect
    • /zh-CN/docs/Web/API/IntersectionObserver/thresholds does not exist but fell back to /en-US/docs/Web/API/IntersectionObserver/thresholds
    • and 3 more flaws omitted
  • broken_links:
    • Can use the English (en-US) link as a fallback
    • Can use the English (en-US) link as a fallback
    • Can use the English (en-US) link as a fallback
  • translation_differences:
    • Differences in the important macros (3 in common of 7 possible)
External URLs (2)

URL: /zh-CN/docs/Web/API/Intersection_Observer_API
Title: 交叉观察器 API

(comment last updated: 2023-12-08 03:08:11)

@jasonren0403 jasonren0403 marked this pull request as ready for review December 6, 2023 02:05
@jasonren0403 jasonren0403 requested a review from a team as a code owner December 6, 2023 02:05
@jasonren0403 jasonren0403 requested review from t7yang and removed request for a team December 6, 2023 02:05
@yin1999 yin1999 requested review from yin1999 and removed request for t7yang December 6, 2023 03:24
yin1999
yin1999 reviewed Dec 7, 2023
View reviewed changes
files/zh-cn/web/api/intersection_observer_api/index.md Outdated Show resolved Hide resolved
files/zh-cn/web/api/intersection_observer_api/index.md Outdated Show resolved Hide resolved
files/zh-cn/web/api/intersection_observer_api/index.md Outdated Show resolved Hide resolved
files/zh-cn/web/api/intersection_observer_api/index.md Outdated Show resolved Hide resolved
files/zh-cn/web/api/intersection_observer_api/index.md Outdated Show resolved Hide resolved
files/zh-cn/web/api/intersection_observer_api/index.md
6. This rectangle is, finally, mapped to the coordinate space of the target's {{domxref("document")}}.
1. 在目标元素上调用 {{domxref("Element.getBoundingClientRect", "getBoundingClientRect()")}} 以获得目标元素的边界矩形（即完全包围组成该元素的每个组件的边界框的最小矩形）。这是最大的交集矩形。其余步骤将删除不相交的部分。
2. 从目标块的直接父块开始向外移动，将每个包含块的剪切（如果有）应用到交叉矩形。一个块的剪切是根据两个块的交点和 {{cssxref("overflow")}} 属性指定的剪切模式（如果有）确定的。将 `overflow` 设置为 `visible` 以外的任何值都会导致剪切发生。
3. 如果其中一个包含元素是嵌套浏览上下文（如 {{HTMLElement("iframe")}} 中包含的文档）的根元素，则交集矩形会剪切到包含上下文的视口，并通过容器的包含块继续向上递归。因此，如果到达 `<iframe>` 的顶层，交集矩形会剪切到框架的视口，然后框架的父元素会成为向交集根递归的下一个块。
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

裁剪

files/zh-cn/web/api/intersection_observer_api/index.md Outdated Show resolved Hide resolved
files/zh-cn/web/api/intersection_observer_api/index.md Outdated Show resolved Hide resolved
files/zh-cn/web/api/intersection_observer_api/index.md Outdated Show resolved Hide resolved
files/zh-cn/web/api/intersection_observer_api/index.md

We could opt to monitor multiple elements for visibility intersection changes with respect to the viewport by calling `observer.observe()` for each of those elements, if we wanted to do so.
我们可以选择监控多个元素相对于视口的可见性交叉变化，如果我们想这样做的话，可以为每个元素调用 `observer.observe()`。
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

+1

yin1999
yin1999 approved these changes Dec 8, 2023
View reviewed changes
Copy link
Member

@yin1999 yin1999 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @jasonren0403

@yin1999 yin1999 merged commit d731417 into main Dec 8, 2023
8 checks passed
@yin1999 yin1999 deleted the intersection-observer-api-zhcn branch December 8, 2023 11:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@yin1999 yin1999 yin1999 approved these changes

Assignees
No one assigned
Labels
l10n-zh Issues related to Chinese content.
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@jasonren0403 @yin1999