Home > Web Front-end > JS Tutorial > Introduction to js browser events_javascript skills

Introduction to js browser events_javascript skills

WBOY
Release: 2016-05-16 17:54:41
Original
1163 people have browsed it

Browser events
Browser events refer to browser events from loading a document until the document is closed, such as the browser loading document event onload, closing the document event onunload, the browser losing focus event onblur, and gaining focus event onfocus. wait.

First examine the following code:

Copy the code The code is as follows:

//Source program 3.1
"http://www.w3.org/TR/REC-html140/strict. dtd">



< ;title>Sample Page!

body>


Load document :


Get focus:


Lost focus:


Drag the scroll bar:< /p>

Change size:





Change the above source program Save it as a *.html (or *.htm) document. After double-clicking the document, the system calls the default browser for browsing.
When the document is loaded, the window.load event is triggered, and a warning box pops up as shown in Figure 3.2.

Figure 3.2 The window.load event is triggered when loading the document
When the focus is given to the document page, the window.onfocus event is triggered. The warning box pops up as shown in Figure 3.3.

Figure 3.3 The window.onfocus event is triggered when the document gains focus
When the page loses focus, the window.blur event is triggered and a warning pops up The frame is shown in Figure 3.4.

Figure 3.4 The window.onblur event is triggered when the document loses focus
When the user drags the scroll bar, the window.onscroll event is triggered and pops up The warning box is shown in Figure 3.5.

Figure 3.5 Drag the scroll bar to trigger the window.onscroll event
When the user changes the document page size, the window.onresize event is triggered. The warning box pops up as shown in Figure 3.6.

Figure 3.6 Change the document page size and trigger the window.onresize event
Browser events are generally used to handle window positioning, set timers or In situations such as setting the page hierarchy and content according to user preferences, it is widely used in the interactivity and dynamics of the page.
Note: Netscape Navigator 4 supports the window.onmove event, which is triggered when the current browser window is moved by the user. It is mainly used for window positioning. . Internet Explorer does not support the window.onmove event.
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template