For example, let’s add an event to the object window to get its width and height and show it on the web page. It is still possible to set onresize attributes or use addEventListener () to set a handler on any element. In some earlier browsers it was possible to register resize event handlers on any HTML element. This event is not cancelable and does not bubble. This function is used to specify what will happen if the size of a window is being changed. Window: resize event The resize event fires when the document view (window) has been resized. This achieves the same result that Mark presents in his answer. throttle( 250, onResize) ) Debounce Example In the following example, onResize() will only be called once at the end of a window resizing action. To add a resize event to the window, we can use the onresize() function in JavaScript. In the following example, onResize() will only be called once every 250 milliseconds during a window resize. Add a Resize Event Using the onresize() Function in JavaScript ![]() You can also use the addEventListener() function to add an event to any object, like a checkbox. You can save the above code into an HTML file and open it with any browser and change its size to see if the code works or not. The width and height of the window will be shown on the page, and it will change as the size of the window is changed. To support versions of IE that are less than 9, you will want to use attachEvent. After the start() function, we added the resize event, which will call the start() function when a user resizes the window. 3 Answers Sorted by: 81 Since you are trying to call this function on the resize of the window, you will want to bind the function to the window and not to the document. ![]() In the script tag, we have a function start(), which is used to change the text of the two spans with the width and height of the window. ![]() The id of the span will be used to get the element in JavaScript. We added a br tag to move the cursor to a new line, and on the new line, we added another span with text Height=, and after that, we added another empty span with an id SpanID2. In the above code, we added a span with text Width=, and after that, we added an empty span with an id SpanID1 in the body section.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |