Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

Cross-browser Window Resize Events ใน JavaScript

สำหรับ Window Resize Event ใช้ addEventListener() โค้ดด้านล่างแสดงขนาดหน้าต่างปัจจุบัน

ตัวอย่าง

<!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>