1. 程式人生 > 程式設計 >vue.js實現點選圖示放大離開時縮小的程式碼

vue.js實現點選圖示放大離開時縮小的程式碼

上篇文章給大家介紹了vue實現裁切圖片同時實現放大、縮小、旋轉功能,今天給大家介紹vue.js實現點選圖示放大離開縮小功能,具體程式碼如下所示:

@-webkit-keyframes pulse1 {
 from {
  -webkit-transform: scale3d(1.05,1.05,1.05);
  transform: scale3d(1.05,1.05);
 }
 
 to {
  -webkit-transform: scale3d(1,1,1);
  transform: scale3d(1,1);
 }
 
 /* to {
  -webkit-transform: scale3d(1,1);
 } */
}
@keyframes pulse1 {
 from {
  -webkit-transform: scale3d(1.05,1);
 } */
}
 
.pulse1 {
 -webkit-animation-name: pulse1;
 animation-name: pulse1;
}
 
@-webkit-keyframes pulse {
 from {
  -webkit-transform: scale3d(1,1);
 }
 
 to {
  -webkit-transform: scale3d(1.05,1.05);
 }
 
 /* to {
  -webkit-transform: scale3d(1,1);
 } */
}
 
@keyframes pulse {
 from {
  -webkit-transform: scale3d(1,1);
 } */
}
 
.pulse {
 -webkit-animation-name: pulse;
 animation-name: pulse;
}
 
.animate1 {
 -webkit-animation-duration: 1s;
 animation-duration: 1s;
 -webkit-animation-fill-mode: both;
 animation-fill-mode: both;
}

到此這篇關於vue.js實現點選圖示放大離開時縮小的程式碼的文章就介紹到這了,更多相關vue實現點選圖示放大離開縮小內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!