zoukankan      html  css  js  c++  java
  • Animate..css的一些属性使用

    使用基本的代码

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title>css</title>
    		<link rel="stylesheet" href="css/animate.compat.css">
    	</head>
    	<body>
    		<div class="animated fadeInLeft">111212</div>
    </html>
    

    属性如下:

    bounce 弹起;反弹
    flash 闪光
    pulse 脉冲
    rubberBand 橡皮圈
    shakeX x动摇
    shakeY y动摇
    headShake 摇头
    swing 摇摆;悬挂
    tada
    wobble 摇摆
    jello
    heartBeat 跳动

    Back entrances 回到入口

    backInDown
    backInLeft
    backInRight
    backInUp

    Back exits 后退

    backOutDown
    backOutLeft
    backOutRight
    backOutUp

    Fading entrances 淡入入口

    fadeIn
    fadeInDown
    fadeInDownBig
    fadeInLeft
    fadeInLeftBig
    fadeInRight
    fadeInRightBig
    fadeInUp
    fadeInUpBig
    fadeInTopLeft
    fadeInTopRight
    fadeInBottomLeft
    fadeInBottomRight

    Fading exits 淡入退出

    fadeOut
    fadeOutDown
    fadeOutDownBig
    fadeOutLeft
    fadeOutLeftBig
    fadeOutRight
    fadeOutRightBig
    fadeOutUp
    fadeOutUpBig
    fadeOutTopLeft
    fadeOutTopRight
    fadeOutBottomRight
    fadeOutBottomLeft

    Flippers

    flip
    flipInX
    flipInY
    flipOutX
    flipOutY

    Lightspeed

    lightSpeedInRight
    lightSpeedInLeft
    lightSpeedOutRight
    lightSpeedOutLeft

    Rotating entrances 旋转入口

    rotateIn
    rotateInDownLeft
    rotateInDownRight
    rotateInUpLeft
    rotateInUpRight

    Rotating exits 选择退出

    rotateOut
    rotateOutDownLeft
    rotateOutDownRight
    rotateOutUpLeft
    rotateOutUpRight

    Specials

    hinge
    jackInTheBox
    rollIn
    rollOut

    Zooming entrances 上升入口

    zoomIn
    zoomInDown
    zoomInLeft
    zoomInRight
    zoomInUp

    Zooming exits 上升出口

    zoomOut
    zoomOutDown
    zoomOutLeft
    zoomOutRight
    zoomOutUp

    Sliding entrances 滑;移动 出口

    slideInDown
    slideInLeft
    slideInRight
    slideInUp

    Sliding exits 滑;移动入口

    slideOutDown
    slideOutLeft
    slideOutRight
    slideOutUp

    这些属性可以自己去试试,可以去更改一下,很简单的,自己调用的一个库

    http://www.jq22.com/yanshi819打开这个看每一个的属性的特效

  • 相关阅读:
    失控
    组织要登信息化这趟高铁要花多少钱买票?
    信息工作的技术(物理)平台
    IT服务系统组成
    传法授业讲缘分
    做好每周工作总结很重要
    编程:对经验世界的析构与建构
    你在哪编程?你的程序原料是什么?
    人的格局与人的底线
    5方与5W
  • 原文地址:https://www.cnblogs.com/easyjie/p/12893692.html
Copyright © 2011-2022 走看看