<video id="i0ich"><input id="i0ich"></input></video>
  • <video id="i0ich"></video>
  • <u id="i0ich"></u>

    <i id="i0ich"><bdo id="i0ich"></bdo></i>

    0712-2888027 189-8648-0214
    微信公眾號

    孝感風信網絡科技有限公司微信公眾號

    當前位置:主頁 > 技術支持 > HTML5/CSS3 > HTML5+CSS3 animations動畫效果插件

    HTML5+CSS3 animations動畫效果插件

    時間:2024-04-16來源:風信官網 點擊: 911次
    HTML5+CSS3 animations動畫效果插件,有非常豐富的動畫顯示效果!

    網址:http://daneden.github.io/animate.css/

    以后制作html5+css3的動畫就變得非常簡單啦!

    CSS3文件下載地址: https://raw.github.com/daneden/animate.css/master/animate.css

    使用方法的說明:https://github.com/daneden/animate.css

    鏈接CSS文件:

    <head>
      <link rel="stylesheet" href="animate.min.css">
    </head>

    使用代碼:

    $('#yourElement').addClass('animated bounceOutLeft');

    $('#yourElement').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', doSomething);

    擴展使用方法:

    $.fn.extend({
        animateCss: function (animationName) {
            var animationEnd = 'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend';
            $(this).addClass('animated ' + animationName).one(animationEnd, function() {
                $(this).removeClass('animated ' + animationName);
            });
        }
    });


    $('#yourElement').animateCss('bounce');

    #yourElement {
      -vendor-animation-duration: 3s;
      -vendor-animation-delay: 2s;
      -vendor-animation-iteration-count: infinite;
    }
    欄目列表
    推薦內容
    熱點內容
    展開
    中文字字幕在线中文无码