注册 登录 充值会员 退出
联系客服 毕业设计 java源码 PHP源码
充值

HTML5网站页面滚动视差效果特效

作者/代码整理:  (源码已亲测,不会安装的可以向QQ1915635791要安装视频教程) 发布日期:2022-06-17
HTML5网站页面滚动视差效果特效
HTML5网站页面滚动视差效果特效是一款鼠标滚动页面带有视差切换显示效果代码。


js代码

<script>
function castParallax() {

  var opThresh = 350;
  var opFactor = 750;

  window.addEventListener("scroll", function(event) {

    var top = this.pageYOffset;

    var layers = document.getElementsByClassName("parallax");
    var layer, speed, yPos;
    for (var i = 0; i < layers.length; i++) {
      layer = layers[i];
      speed = layer.getAttribute('data-speed');
      var yPos = -(top * speed / 100);
      layer.setAttribute('style', 'transform: translate3d(0px, ' + yPos + 'px, 0px)');

    }
  });
}

document.body.onload = castParallax();
</script>

关注公众号,免费赠送安装视频教程、环境和学习视频,后面会不断更新。