下面是实现滚屏效果的方法的完整攻略：

利用JavaScript脚本实现滚屏效果的方法

基本思路

我们可以通过监听鼠标或者触摸事件，根据移动的距离来控制页面滚动的位置，从而实现滚屏效果。具体的步骤如下：

1. 监听鼠标或者触摸事件，获取开始移动时的位置和移动的距离。
2. 根据移动的距离计算需要滚动的距离。
3. 利用window.scrollTo()函数来滚动页面的位置。
4. 处理边界情况，确保不会滚动出页面的范围。

示例代码

以下是两条示例说明：

示例1：监听鼠标滚轮事件实现滚屏效果

const wheelHandler = (event) => {
  event.preventDefault(); // 阻止默认的滚动行为
  const delta = event.deltaY; // 获取鼠标滚动的距离
  const offset = delta > 0 ? 100 : -100; // 计算滚动的距离
  const currentPos = window.pageYOffset; // 获取当前的滚动位置
  window.scrollTo(0, currentPos + offset); // 滚动页面
};

window.addEventListener("wheel", wheelHandler, { passive: false });

在这个示例中，我们监听了鼠标滚轮事件，获取滚动距离并计算需要滚动的距离，然后利用window.scrollTo()函数滚动页面的位置。

示例2：监听触摸事件实现滚屏效果

let startPos = 0;
let lastPos = 0;

const touchStartHandler = (event) => {
  startPos = event.touches[0].pageY; // 记录触摸起始位置
};

const touchMoveHandler = (event) => {
  event.preventDefault(); // 阻止默认的滑动行为
  const currentPos = event.touches[0].pageY; // 获取当前的触摸位置
  const distance = currentPos - startPos; // 计算移动的距离
  window.scrollTo(0, lastPos - distance); // 滚动页面
};

const touchEndHandler = (event) => {
  lastPos = window.pageYOffset; // 记录最后的滚动位置
};

window.addEventListener("touchstart", touchStartHandler);
window.addEventListener("touchmove", touchMoveHandler, { passive: false });
window.addEventListener("touchend", touchEndHandler);

在这个示例中，我们监听了触摸事件，记录了触摸起始位置和最后的滚动位置，通过计算移动的距离来滚动页面。同时，还需要注意阻止默认的滑动行为，避免页面的上下滑动。

以上就是实现滚屏效果的方法的完整攻略。