Skip to content

4-框架和窗口/01-弹窗 和 4-框架和窗口/index.md#217

Merged
leviding merged 5 commits intojavascript-tutorial:zh-hansfrom
haochuan9421:translation/frames-and-windows
Sep 16, 2018
Merged

4-框架和窗口/01-弹窗 和 4-框架和窗口/index.md#217
leviding merged 5 commits intojavascript-tutorial:zh-hansfrom
haochuan9421:translation/frames-and-windows

Conversation

@haochuan9421
Copy link
Copy Markdown
Contributor

4-框架和窗口/01-弹窗 和 4-框架和窗口/index.md

译文翻译完成,resolve #198

弹窗和 window 方法——翻译完成
框架和窗口——翻译完成
标点符号修改
@haochuan9421
Copy link
Copy Markdown
Contributor Author

@leviding 翻译完成

@BriFuture
Copy link
Copy Markdown

校对认领 @leviding

@leviding
Copy link
Copy Markdown
Member

@BriFuture 👌

Copy link
Copy Markdown

@BriFuture BriFuture left a comment

Choose a reason for hiding this comment

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

总体来说翻译的不错,但是有几个小问题:

  1. 笔误(打错字和中英文的空格,函数调用的括号写成中文的)
  2. 某些感觉译文不太流畅(我改了之后你看看是否合适)

啊感觉这篇英文原文有几个地方使用的代词 it 和 them 指代不是很明确,我对自己的翻译也不是很有把握。

弹窗在 Chrome 中会打开,但是在 Firefox 被阻止。

...And this works in Firefox too:
...而且这段代码在 Firefox 中也又有效:
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

而且这段代码在 Firefox 中也又有效 => 而这段代码在 Firefox 又有效果

```

The difference is that Firefox treats a timeout of 2000ms or less are acceptable, but after it -- removes the "trust", assuming that now it's "outside of the user action". So the first one is blocked, and the second one is not.
不同之处在于 Firefox 可以接受 2000 毫秒或更短的延迟,但当它 -- 移除这个“信任”, 就会假定现在“在用户的行动之外”。所以第一个被禁止,而第二个却没有。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

所以第一个被禁止 => 所以第一个弹窗被禁止

感觉加上 “弹窗“ 后并不啰嗦,但是含义清楚些

```

The difference is that Firefox treats a timeout of 2000ms or less are acceptable, but after it -- removes the "trust", assuming that now it's "outside of the user action". So the first one is blocked, and the second one is not.
不同之处在于 Firefox 可以接受 2000 毫秒或更短的延迟,但当它 -- 移除这个“信任”, 就会假定现在“在用户的行动之外”。所以第一个被禁止,而第二个却没有。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

but after it 这一句我认为不是 “在这之后”,而是“超过 2000ms“。
但当它 -- 移除这个“信任”, 就会假定现在“在用户的行动之外”。 => 但是超过这个时间 —— firefox 就会取消 “信任”,认为这 “不属于用户操作”。

到目前位置,我们有很多方法可以使用 JavaScript 加载和显示页面上的数据。但是仍然有弹窗表现更好的情况。

For instance, many shops use online chats for consulting people. A visitor clicks on the button, it runs `window.open` and opens the popup with the chat.
例如,许多购物网站为咨询的人们提供在线聊天。访问者点击按钮,它运行 `window.open` 并打开聊天弹窗。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

访问者点击按钮,它运行 window.open => 访问者点击按钮,就会执行 window.open

2. A popup is very simple to attach to a site, little to no overhead. It's only a small button, without additional scripts.
3. A popup may persist even if the user left the page. For example, a consult advices the user to visit the page of a new "Super-Cooler" goodie. The user goes there in the main window without leaving the chat.
1. 弹窗是一个独立的窗口,具有自己独立的 JavaScript 运行环境。因此,聊天服务不需要和主要的购物网站的脚本集成在一起。
2. 弹窗很容易附加到网站,几乎没有开销。它就是一个小按钮,不需要额外的脚本。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

它就是一个小按钮 => 只需要一个小按钮

这里“它”应该指弹窗,如果确实指弹窗的话又说“它是一个小按钮“有些不合理。

当一个用户尝试从窗口切换出去(`blur`),它又让它重新聚焦。目的是将用户“锁定”在 `window` 内。

So, there are limitations that forbid the code like that. There are many limitations to protect the user from ads and evils pages. They depend on the browser.
因此,有限制去禁止这样的代码。保护用户免受广告和恶意网站的限制有很多。这取决于浏览器。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

有限制去禁止这样的代码 => 存在禁用相似代码的措施。

- When we open a popup, it's might be a good idea to run a `newWindow.focus()` on it. Just in case, for some OS/browser combinations it ensures that the user is in the new window now.
- If we want to track when a visitor actually uses our web-app, we can track `window.onfocus/onblur`. That allows us to suspend/resume in-page activities, animations etc. But please note that the `blur` event means that the visitor switched out from the window, but he still may observe it. The window is in the background, but still may be visible.
- 当我们打开弹窗时,在它上面执行 `newWindow.focus()` 可能是个好主意。为了以防万一,对于某些 OS/浏览器组合,它确保用户现在处于新窗口中。
- 如果我们想要跟踪访问者何时在实际使用我们的网页应用,我们可以跟踪 `window.onfocus/onblur`。这允许我们在暂停/恢复页面活动,动画等。但是请注意,`blur` 事件意味着访问者从窗口切换出来,但他仍然可以观察它。窗口在后台,但依然可见。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

但依然可见 => 但仍有可能是可见的

在后台有可能是可见的,也有可能是不可见的,比如最小化了

- Methods `focus()` and `blur()` allow to focus/unfocus a window. Sometimes.
- Events `focus` and `blur` allow to track switching in and out of the window. But please note that a window may still be visible even in the background state, after `blur`.
- 弹窗可以通过 `open(url, name, params)` 调用。它返回新窗口的引用。
- 默认情况下,浏览器会阻止来自用户操作之外的代码中的 `open` 调用。通常会出现通知,以便用户可以允许它们。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

以便用户可以允许它们 => 以便用户可以允许浏览器执行阻拦操作

感觉这个位置的英文就说的不详细,我的翻译也不太好,你再好好看看吧

- 如果主窗口和弹窗同源,它们彼此之间可以自由的读取和修改。否则,他们可以改变彼此的地址并使用消息进行通信(后续章节)。
- 关闭弹窗:通过调用 `close()` 方法。用户也可以关闭它们(就像任何其他窗口一样)。关闭之后 `window.closed` 返回 `true`
- `focus()` and `blur()` 方法允许聚焦/失焦窗口。有时候。
- `focus `和 `blur` 事件允许跟踪窗口的切换。但请注意,在 `blur` 之后,即使在后台,窗口仍然可见。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

窗口仍然可见 => 窗口仍有可能是可见的

理由上同

- `focus `和 `blur` 事件允许跟踪窗口的切换。但请注意,在 `blur` 之后,即使在后台,窗口仍然可见。

Also if we open a popup, a good practice is to notify the user about it. An icon with the opening window can help the visitor to survive the focus shift and keep both windows in mind.
此外,如果我们打开一个弹窗,通知用户是一种好的做法。带有图标的打开窗口可以帮助访客在焦点切换中幸存并记住两个窗口。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

帮助访客在焦点切换中幸存 => 帮助访客免受焦点切换的困扰

@BriFuture
Copy link
Copy Markdown

校对完成
@leviding @haochuan9421

@leviding
Copy link
Copy Markdown
Member

@BriFuture 很赞, @haochuan9421 可以修改啦

@leviding leviding added the enhancement New feature or request label Sep 15, 2018
根据@BriFuture 的校对意见进行调整
@haochuan9421
Copy link
Copy Markdown
Contributor Author

@BriFuture 调整完毕喽,校对的很仔细,我么-->我们都看到了,不好意思😄

Copy link
Copy Markdown

@BriFuture BriFuture left a comment

Choose a reason for hiding this comment

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

@haochuan9421 好了,只剩下一个小问题,原文中的 width/height 你觉得翻译成 “宽度/高度”,用引号就行,我觉得应该保留突出显示:宽度/高度,但我不能断定,我觉得还是看看其他人的意见吧。

@leviding 已经修改完了。只剩一个小问题

```

Please note that external `document` content is only accessible for windows from the same origin (the same protocol://domain:port).
请注意,外部的 `document` 内容仅可被同源(相同的 协议://域名:端口)的 window 访问。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

哦好吧,这里是我弄错了

```

Here most "window features" are disabled and window is positioned offscreen. Run it and see what really happens. Most browsers "fix" odd things like zero `width/height` and offscreen `left/top`. For instance, Chrome open such a window with full width/height, so that it occupies the full screen.
这里大多数的“窗口特征”都被禁用而且窗口的位置脱离屏幕。执行看看究竟会发生什么。大多数浏览器修复了像零 `width/height` 和 脱离屏幕的 `left/top` 的奇怪设置。例如,Chrome 打开这样一个全 width/height 的窗口,使其占满整个屏幕。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

哦好的

- 如果 `open` 调用中没有第三个参数,或者它是空的,则使用默认的窗口参数。
- 如果存在参数字符串,但是省略了某些 yes/no 的特性,那么如果浏览器允许,则禁用省略的特性。因此,如果指定参数,请确保将所有必需的特性明确设置为 yes
- 如果参数中没有 `left/top`,则浏览器会尝试在最后打开的窗口附近打开一个新窗口。
- 如果没有“宽度/高度”,则新窗口的大小与上次打开的大小相同。
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

看看第三个人的意见吧

@haochuan9421
Copy link
Copy Markdown
Contributor Author

@BriFuture 好的,不过这个 repo 的校对人比较少

@leviding leviding merged commit 4154cbf into javascript-tutorial:zh-hans Sep 16, 2018
@leviding
Copy link
Copy Markdown
Member

辛苦啦,这个 repo 校对确实少,不知为什么。有空多校对下哈,近期本 repo 校对基本都翻倍哈

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants