javaScript：滚动事件以及窗口事件

目录

scroll：滚动事件：

例子：

滚动事件的属性和方法：

窗口事件：

resize:窗口大小改变事件：

beforeunload:窗口关闭事件：

load:窗口打开事件：

注意 

---

滚动事件和窗口事件是在网页开发中常用的两类事件，它们可以通过JavaScript来处理。

scroll：滚动事件：

滚动事件在用户滚动网页时触发。这可以是垂直滚动（向上或向下）或水平滚动（向左或向右）。

例子：

let wp = document.querySelector('.wp')
wp.onscroll = function(){
    console.log(event);
};

滚动事件的属性和方法：

• window.scrollX：获取文档在水平方向已滚动的距离。
• window.scrollY：获取文档在垂直方向已滚动的距离。

窗口事件：

窗口事件涵盖了浏览器窗口的各种变化，如窗口大小的改变、窗口的打开与关闭等。

resize:窗口大小改变事件：

window.addEventListener('resize', function() { // 窗口大小改变时执行的代码 });

beforeunload:窗口关闭事件：

window.addEventListener('beforeunload', function(event) { // 在窗口关闭前执行的代码 // 可以用来询问用户是否真的要离开页面 event.preventDefault(); event.returnValue = ''; });

load:窗口打开事件：

window.addEventListener('load', function() { // 页面完全加载后执行的代码 });

注意 

        这些事件可以用来实现响应式设计、动态调整页面元素等功能，提升用户体验。在处理这些事件时，需要考虑兼容性以确保在不同浏览器环境下都能正常运行。