vue,css动画+手风琴,鼠标经过播放暂停动画 2021-07-06

最新推荐文章于 2023-11-13 20:25:54 发布

Jiang_XiaoBai007

最新推荐文章于 2023-11-13 20:25:54 发布

阅读量254

点赞数

分类专栏： css动画 css手风琴文章标签： css

本文链接：https://blog.csdn.net/Jiang_XiaoBai007/article/details/118521122

版权

本文介绍了如何在Vue项目中实现一个CSS动画效果，特别是手风琴（accordion）功能，并详细讲解了如何通过CSS实现鼠标悬停时暂停动画的技巧，为用户提供更好的交互体验。

摘要由CSDN通过智能技术生成

vue,css动画+手风琴,鼠标经过播放暂停动画

<template>
  <div class="accordian">
    <ul class="partner" ref="partner" @mouseenter="change" @mouseleave="run">
      <li>
        <div class="image_title">
          <a href="#">KungFu Panda11</a>
          <a href="#">KungFu Panda KungFu PandaKungFu PandaKungFu PandaKungFu PandaKungFu PandaKungFu Panda</a>
        </div>
        <a href="#">
          <img src="https://thecodeplayer.com/uploads/media/3yiC6Yq.jpg" />
        </a>
      </li>
      <li>
        <div class="image_title">
          <a href="#">Toy Story 11</a>
          <a href="#">KungFu Panda KungFu PandaKungFu PandaKungFu PandaKungFu PandaKungFu PandaKungFu Panda</a>

        </div>
        <a href="#">
          <img src="http://thecodeplayer.com/uploads/media/40Ly3VB.jpg" />
        </a>
      </li>
      <li>
        <div class="image_title">
          <a href="#">Wall-E 11</a>