当我们向上滚动时，两个div缩小，另一个div gowing

当我们向上滚动时，两个div缩小，另一个div growing。

这个问题涉及到前端开发和CSS动画的知识。

首先，我们需要使用CSS来实现这个效果。可以通过CSS的transform属性来缩小和放大元素，以及transition属性来实现平滑的动画效果。

具体的实现步骤如下：

首先，在HTML中创建三个div元素，分别给它们添加不同的类名，例如"div1"、"div2"和"div3"。

<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>

在CSS中，为这三个div元素设置样式，并使用transform属性将div1和div2缩小，div3放大。

.div1 {
  transform: scale(0.5);
  transition: transform 0.5s ease;
}

.div2 {
  transform: scale(0.5);
  transition: transform 0.5s ease;
}

.div3 {
  transform: scale(1.5);
  transition: transform 0.5s ease;
}

接下来，我们需要使用JavaScript来监听滚动事件，并根据滚动方向来改变div元素的样式。

window.addEventListener('scroll', function() {
  var scrollDirection = getScrollDirection();
  
  if (scrollDirection === 'up') {
    document.querySelector('.div1').style.transform = 'scale(0.5)';
    document.querySelector('.div2').style.transform = 'scale(0.5)';
    document.querySelector('.div3').style.transform = 'scale(1.5)';
  } else if (scrollDirection === 'down') {
    document.querySelector('.div1').style.transform = 'scale(1)';
    document.querySelector('.div2').style.transform = 'scale(1)';
    document.querySelector('.div3').style.transform = 'scale(1)';
  }
});

function getScrollDirection() {
  var lastScrollTop = window.pageYOffset || document.documentElement.scrollTop;
  
  window.addEventListener('scroll', function() {
    var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
    
    if (scrollTop > lastScrollTop) {
      lastScrollTop = scrollTop;
      return 'down';
    } else if (scrollTop < lastScrollTop) {
      lastScrollTop = scrollTop;
      return 'up';
    }
  });
}

以上代码中，我们使用了getScrollDirection函数来获取滚动方向，然后根据滚动方向来改变div元素的样式。

这样，当我们向上滚动时，div1和div2会缩小，div3会放大；当我们向下滚动时，所有的div元素都会恢复到原始大小。

这个效果可以应用在各种网页设计中，例如滚动时的动态效果展示、页面切换动画等。

推荐的腾讯云相关产品和产品介绍链接地址：