jquery实现海底鱼儿数量速度控制游动动画效果代码-html代码-BFW代码库

jquery实现海底鱼儿数量速度控制游动动画效果代码

代码语言：html

所属分类：动画

代码描述：jquery实现海底鱼儿数量速度控制游动动画效果代码，可对鱼的数量进行增减，鱼儿游动的速度也可增减。

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

<!DOCTYPE>
<html lang="zh">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="Content-Language" content="zh-CN">
    <style>
        .draw-line{
        stroke-width:3;
        stroke-dasharray: 3,2;
        stroke: #FF8C00;
    }.other-f1{
        stroke: lightskyblue;
    }.other-f2  {
        stroke: #11EE3D;
    }.other-f3  {
        stroke: #E6E61A;
    }.other-f4  {
        stroke: #2B2BD5;
    }.other-f5  {
        stroke: #808080;
    }.other-f6  {
        stroke: #F70938;
    }.other-f7  {
        stroke: #44A3BB;
    }.other-f8  {
        stroke: #9E4DB3;
    }
    .btn{
        padding: 5px 10px;margin: 3px;border: none;background-color: #0c8cc7;color: white;border-radius: 2px;outline: none;cursor: pointer;
        font-family: Microsoft YaHei;font-size: 14px;
    }
    </style>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
    <script>
        (function(){
        var config;
        var me;
        var zFish = {config : config = {
                delay: 20,
                svgH: 0,
                svgW: 0,
                da: 40,//加速度
                df: 8,//默认阻力
            },
            fishArr: []
        };
    
        me = {
            id: 'user0',
            clazz: '',
            type: 1,
            seed: 0,
            head:{
                r : 7,
                x : 50,
                y : 50,
                vx : 0,
                vy : 0,
                xPower : 0,//-1 0 1 横向加速度
                yPower : 0,//-1 0 1 纵向加速度
            },
            body:[
                {x:0,y:0,r:8},
                {x:0,y:0,r:9},
                {x:0,y:0,r:9},
                {x:0,y:0,r:8},
                {x:0,y:0,r:7},
                {x:0,y:0,r:5},
                {x:0,y:0,r:4},
                {x:0,y:0,r:5},
            ]
        };
        function makeSVG(tag,id) {
            var ns = 'http://www.w3.org/2000/svg';
            var el= document.createElementNS(ns, tag);
          .........完整代码请登录后点击上方下载按钮下载查看