domlastic实现点击删除弹性动画效果代码

代码语言:html

所属分类:动画

代码描述:domlastic实现点击删除弹性动画效果代码

代码标签: 删除 弹性 动画 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html class="demoFrame">

<head lang="en">
    <meta charset="UTF-8">
    <title>DomLastic.js</title>
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <meta name="description" content="">
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-ui-1.10.3.min.js"></script>

    <!-- domLastic.js -->
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/domlastic.js"></script>

    <!-- set example DomLastic events -->
    <style>
        html {
            height: 100%;
            background: #373737;
            background: radial-gradient(ellipse atcenter, #373737 0%, #222 100%);
            background-size: cover;
            background-repeat: no-repeat;
           
        }

        body {
            color: #ccc;
            font-family: Menlo;
            margin: 0;
            padding: 0;
            background: #373737;
            background: radial-gradient(ellipse atcenter, #373737 0%, #222 100%);
            background-size: cover;
            background-repeat: no-repeat;
        }

        h1 {
            color: #fff;
        }

        h2, h3, h4 {
            color: #ccc;
            font-weight: 100;
        }

        h2 {
            margin: 0 0 5px;
            font-size: 14px;
        }

        h3 {
            margin: -10px 0 45px;
            font-size: 16px;
        }

        p {
            width: 59%;
            margin: auto;
            margin-bottom: 40px;
            border-bottom: 1px solid #3f3f3f;
            font-weight: 100;
            padding-bottom: 3px;
            font-size: 12px;
        }

        .demo {
            min-height: 95%;
            text-align: center;
        }

        .demoFrame-1-header, .demoFrame-2-header, .demoFrame-3-header {
            border-bottom: 1px solid #3f3f3f;
            margin-right: 10px;
        }

        iframe {
            overflow: hidden;
            height: 730px;
            width: 280px;
            vertical-align: top;
            background-color: transparent;
        }

        .demoFrame {.........完整代码请登录后点击上方下载按钮下载查看

网友评论0