詳細講解給萌新,我姓雷。
話不多說,先簡化代碼,把兼容代碼去掉,然后看代碼里的注釋
.change img{
? display:block;
? width:300px;
? height:284px;
? opacity:0;
? transform:translate(-100px,-100px);
? transition: opacity 1s ease-in-out 0.5s,transform 3s ease-in-out;
}
.change:hover img{
? transform:translate(0px,0px);
? opacity:1;
/*透明度1s時間完成轉換(由0到1),{兩邊的ease-in-ou不用說了吧},transform:1s時間完成轉換(xy值-100px到0px)? .1s就是我和你賽車我先讓你搶跑0.1s在追上你的意思 */
? transition: opacity 1s ease-in-out,transform 1s ease-in-out .1s;
}
2019-04-17
你的問題呢??