- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
What is cross-browser window resize events in JavaScript?
For window resize event in JavaScript, use addEventListener(). The following code will give you the size of the current window −
Example
<!DOCTYPE html>
<html>
<head>
<style>
div {
margin-top: 10px;
padding: 10px;
background-color: #1E9E5D;
width: 50%;
} span {
font-size: 50px;
}
</style>
<script>
window.addEventListener('resize', display);
function display() {
document.querySelector('.width').innerText = document.documentElement.clientWidth;
document.querySelector('.height').innerText = document.documentElement.clientHeight;
}
display();
</script>
</head>
<div>
<span>Width= <span class="width"></span></span><br />
<span>Height= <span class="height"></span></span>
</div>
</body>
</html>
Updated on 16-Jun-2020 12:05:49
- Related Questions & Answers
- How to Resize Browser Window in WebDriver?
- Introduction to browser events in JavaScript
- Which is the event when the browser window is resized in JavaScript?
- Setting Cross Browser Opacity using CSS
- Best Cross Browser Compatibility Testing Tools
- What are events in JavaScript?
- 20 Best Cross Browser Compatibility Testing Tools
- Cross Browser Solution for Image Marker in CSS
- What's the best way to open new browser window using JavaScript?
- What are JavaScript DOM Events?
- How can I resize the root window in Tkinter?
- Cross-browser drag-and-drop HTML file upload?
- Execute a script when the browser window is closed in HTML?
- What is Browser Fingerprinting?
- Dynamically Resize Buttons When Resizing a Window using Tkinter
Advertisements