zim实现万圣节森林中百鬼出没动画效果代码

代码语言:html

所属分类:动画

代码描述:zim实现万圣节森林中百鬼出没动画效果代码

代码标签: zim 动画 万圣节 小鬼

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">


</head>

<body translate="no">

    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/createjs-1.3.2.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/zim_nft.js"></script>

    <script>
        const assets = [
        "//repo.bfw.wiki/bfwrepo/image/616f54f8e4a91.png",
     ];
        
        const frame = new Frame(FIT, 1024, 768, black, black, assets);
        frame.on("ready", () => {// ES6 Arrow Function - similar to function(){}
          zog("ready from ZIM Frame"); // logs in console (F12 - choose console)
        
          // often need below - so consider it part of the template
          const stage = frame.stage;
          const stageW = frame.width;
          const stageH = frame.height;
        
          // REFERENCES for ZIM at https://zimjs.com
          // see https://zimjs.com/intro.html for an intro example
          // see https://zimjs.com/learn.html for video and code tutorials
          // see https://zimjs.com/docs.html for documentation
          // see https://codepen.io/topic/zim/ for ZIM on CodePen
        
          // *** NOTE: since ZIM Cat (before ZIM NFT) ZIM defaults to time in seconds
          // All previous versions, examples, videos, etc. have time in milliseconds
          // This can be set back with TIME = "milliseconds" but we suggest you give it a try!
        
          // CODE HERE
        
          // Add backing picture to canvas
          asset("//repo.bfw.wiki/bfwrepo/image/616f54f8e4a91.png").center();
        
          // the Button will have a flare shape which happens to be one of the ZIM shapes
          // with three states: normal, roll and wait 
          // so set the colors for these states using a STYLE with series 
          // also center the registration but do not add each one
          // or could do this in each Flare below 
          STYLE = {
            Flare: {
              color: series(black, red, yellow), // ZIM VEE values allow you to pick from a series
              centerReg: { add: false } } };
        
        
        
          const button = new Button({
            label: new Label({
              text: "SUMMON",
              font: "eldorado",
              size: 30,
              shiftHorizontal: 12 // so it looks better on the Flare
            }),
            backing: new Flare(),
            rollBacking: new Flare(),
            waitBacking: new Flare(),
            wait: "TRULY?", // this will change the text to a confirm text...
            waitTime: 2 }).
        
          sca(4).
          alp(.3).
          centerReg(); // so it rotates nicely when animated
        
        
          button.on("mousedown", e => .........完整代码请登录后点击上方下载按钮下载查看

网友评论0