jquery+css实现钱袋点击撒金币动画效果代码-html代码-BFW代码库

jquery+css实现钱袋点击撒金币动画效果代码

代码语言：html

所属分类：动画

代码描述：jquery+css实现钱袋点击撒金币动画效果代码

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/animate.4.1.1.css">
    <style type="text/css">
        .main{width:200px;margin:0 auto;}.item1{height:150px;position:relative;padding:30px;text-align:center;-webkit-transition:top 1.2s linear;transition:top 1.2s linear;}.item1 .kodai{position:absolute;bottom:0;cursor:pointer;}.item1 .kodai .full{display:block;}.item1 .kodai .empty{display:none;}.item1 .clipped-box{display:none;position:absolute;bottom:40px;left:80px;height:540px;width:980px;}.item1 .clipped-box img{position:absolute;top:auto;left:0;bottom:0;-webkit-transition:-webkit-transform 1.4s ease-in,background 0.3s ease-in;transition:transform 1.4s ease-in;}
    </style>
</head>

<body style="padding:100px 0 0 0;">
    <div class="main">
        <div class="item1">
            <div class="kodai">
                <img src="//repo.bfw.wiki/bfwrepo/images/lottery/kd2.png" class="full" />
                <img src="//repo.bfw.wiki/bfwrepo/images/lottery/kd1.png" class="empty" />
            </div>
            <div class="clipped-box"></div>
        </div>
        <p id="html"></p>
    </div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-1.8.3.js"></script>
    <script type="text/javascript">
$(document).ready(function () {
    (genClips = function () .........完整代码请登录后点击上方下载按钮下载查看