当前位置:主页 > JavsScript库 > 动画 >

用于CSS3动画的小型JS库 - Animate Display Property
栏目分类:动画   发布日期:2021-08-31   浏览次数:

Animate Display Property 是一个小型 JavaScript 插件,允许您在特定元素上应用 CSS3 动画。

动画包括:

  • 褪色

  • 滑动:向左滑动、向右滑动、向上滑动、向下滑动

  • 缩放:放大、缩小

  • 旋转:向左旋转,向右旋转

  • 翻转:向上翻转、向下翻转、向右翻转、向左翻转

使用:

在网页上包含 JavaScript 'adp.js' 和样式表 'adp.css'。

<link rel="stylesheet" href="css/adp.min.css">
<script src="js/adp.min.js"></script>

将您选择的基于 CSS3 的 Show 动画应用到您的元素。

var el = document.querySelector('.el');
ADP.show(el, 'fade');

将您选择的基于 CSS3 的隐藏动画应用到您的元素。

var el = document.querySelector('.el');
ADP.hide(el, 'fade');

切换动画。

var el = document.querySelector('.el');
ADP.toggle(el, 'fade');

播放动画时执行回调函数。

var el = document.querySelector('.el');
ADP.toggle(el, 'fade', , function(state) {
  console.log('Callback fired with ' + state);
}););



官方网站:https://github.com/bilalshareef/animate-display-property

相关热词:

相关下载
声源:本站内容均来自互联网,仅供交流学习之用,请勿作商业用途,所有资源版权归原作者所有。如果有侵犯到您的权益,请联系本站删除,谢谢合作!
jQuery库 JavsScript库 Html5库 CSS3库