1. 程式人生 > >vue專案中如何使用動畫效果

vue專案中如何使用動畫效果

滑鼠滑入滑出圖片逐漸放大的效果

<div class="video-item">
  <div class="video-img">
        <img src="../../assets/images/img1.jpg"/>
    </div>
</div>

scss

.video-item{
    height: 440px;
    background: $aColor;
    text-align: center;
    overflow: hidden;
    .video-img{
        width
: 100%; height: 220px; overflow: hidden; display: flex; justify-content: center; align-items: center; img{ min-width: 100%; min-height: 220px; margin: 0 auto; transition: all 0.6s linear; &:hover{
transform: scale(1.4); } } } }

Vue——關於css過渡和動畫那些事
https://www.cnblogs.com/ly2646/p/9469551.html