From 8824afb494e5398bc0efcf5f7eb78782096fc90c Mon Sep 17 00:00:00 2001 From: A1lo Date: Fri, 18 Mar 2022 21:53:46 +0800 Subject: Replace marco `anch` with `` tag for `zh-CN` (#4668) * replace anch with tag `` * auto replace anch with scripts * fix: resolve some incorrect anchors * replace anch with markdown link in markdown files * sync with english version for `Properties` * fix: resolve some incorrect anchors * using `Specifications` marco to replace `` * fix: resolve some incorrect anchors * remove the `noteCard` and add a `h2` head * fix: resolve some incorrect anchors * remove the duplicated content * fix: resolve some incorrect anchors * fix: resolve some incorrect anchors * revert the content change and replace anch * revert the content change and replace anch * revert the content chang * fix: correct the `href` * revert content changes and replace the anch * fix: resolve some incorrect anchors * fix: resolve some incorrect anchors * fix: resolve some incorrect anchors --- .../timing_element_visibility/index.html | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'files/zh-cn/web/api/intersection_observer_api') diff --git a/files/zh-cn/web/api/intersection_observer_api/timing_element_visibility/index.html b/files/zh-cn/web/api/intersection_observer_api/timing_element_visibility/index.html index 37c36f7c23..643a5cc3f6 100644 --- a/files/zh-cn/web/api/intersection_observer_api/timing_element_visibility/index.html +++ b/files/zh-cn/web/api/intersection_observer_api/timing_element_visibility/index.html @@ -302,7 +302,7 @@ function startup() {

Handling periodic actions

-

Our interval handler, handleRefreshInterval(), is called about once per second courtesy of the call to {{domxref("WindowOrGlobalScope.setInterval", "setInterval")}} made in the startup() function {{anch("Setting up", "described above")}}. Its main job is to update the timers every second and schedule a redraw to update the timers we'll be drawing within each ad.

+

Our interval handler, handleRefreshInterval(), is called about once per second courtesy of the call to {{domxref("WindowOrGlobalScope.setInterval", "setInterval")}} made in the startup() function described above. Its main job is to update the timers every second and schedule a redraw to update the timers we'll be drawing within each ad.

function handleRefreshInterval() {
   let redrawList = [];
@@ -333,7 +333,7 @@ function startup() {
 
 

Updating an ad's visibility timer

-

Previously (see {{anch("Handling document visibility changes")}} and {{anch("Handling periodic actions")}}), we've seen that when we need to update an ad's "total visible time" counter, we call a function named updateAdTimer() to do so. This function takes as an input an ad's {{domxref("HTMLDivElement")}} object. Here it is:

+

Previously (see Handling document visibility changes and Handling periodic actions), we've seen that when we need to update an ad's "total visible time" counter, we call a function named updateAdTimer() to do so. This function takes as an input an ad's {{domxref("HTMLDivElement")}} object. Here it is:

function updateAdTimer(adBox) {
   let lastStarted = adBox.dataset.lastViewStarted;
@@ -382,7 +382,7 @@ function startup() {
 
 

Building the page contents

-

The buildContents() function is called by the {{anch("Setting up", "startup code")}} to select and insert into the document the articles and ads to be presented:

+

The buildContents() function is called by the startup code to select and insert into the document the articles and ads to be presented:

let loremIpsum = "<p>Lorem ipsum dolor sit amet, consectetur adipiscing" +
   " elit. Cras at sem diam. Vestibulum venenatis massa in tincidunt" +
@@ -525,11 +525,11 @@ function buildContents() {
 
 

Finally, we set the ID of the <div> which will show the timer we'll present in the ad to show how long it's been visible, giving it the class "timer". The initial text is set to "0:00", to represent the starting time of 0 minutes and 0 seconds, and it's appended to the ad.

-

If we're not replacing an existing ad, we need to append the element to the content area of the page using {{domxref("Node.appendChild", "Document.appendChild()")}}. If we're replacing an ad, it's already there, with its contents replaced with the new ad's. Then we call the {{domxref("IntersectionObserver.observe", "observe()")}} method on our Intersection Observer, adObserver, to start watching the ad for changes to its intersection with the viewport. From now on, any time the ad becomes 100% obscured or even a single pixel becomes visible, or the ad passes through 75% visible in one way or another, the {{anch("Handling intersection changes", "observer's callback")}} is executed.

+

If we're not replacing an existing ad, we need to append the element to the content area of the page using {{domxref("Node.appendChild", "Document.appendChild()")}}. If we're replacing an ad, it's already there, with its contents replaced with the new ad's. Then we call the {{domxref("IntersectionObserver.observe", "observe()")}} method on our Intersection Observer, adObserver, to start watching the ad for changes to its intersection with the viewport. From now on, any time the ad becomes 100% obscured or even a single pixel becomes visible, or the ad passes through 75% visible in one way or another, the observer's callback is executed.

Replacing an existing ad

-

Our {{anch("Handling intersection changes", "observer's callback")}} keeps an eye out for ads which become 100% obscured and have a total visible time of at least one minute. When that happens, the replaceAd() function is called with that ad's element as an input, so that the old ad can be replaced with a new one.

+

Our observer's callback keeps an eye out for ads which become 100% obscured and have a total visible time of at least one minute. When that happens, the replaceAd() function is called with that ad's element as an input, so that the old ad can be replaced with a new one.

function replaceAd(adBox) {
   let visibleTime;
@@ -544,7 +544,7 @@ function buildContents() {
 
 

replaceAd() begins by calling updateAdTimer() on the existing ad, to ensure that its timer is up-to-date. This ensures that when we read its totalViewTime, we see the exact final value for how long the ad was visible to the user. We then report that data; in this case, by logging it to console, but in the real world, you'd submit the information to an ad service's API or save it into a database.

-

Then we load a new ad by calling {{anch("Creating an ad", "loadRandomAd()")}}, specifying the ad to be replaced as an input parameter. As we saw previously, loadRandomAd() will replace an existing ad with content and data corresponding to a new ad, if you specify an existing ad's element as an input parameter.

+

Then we load a new ad by calling loadRandomAd(), specifying the ad to be replaced as an input parameter. As we saw previously, loadRandomAd() will replace an existing ad with content and data corresponding to a new ad, if you specify an existing ad's element as an input parameter.

The new ad's element object is returned to the caller in case it's needed.

-- cgit v1.2.3-54-g00ecf