Question

可能的修复（随着时间的推移效率/性能问题？）

$.validator.addMethod("fileextensions",
        function (value, element, param) {
            var fileType = $(element)[0].files[0].type;
            var fileTypes = ["image/jpeg", "image/pjpeg", "image/gif", "image/bmp", "image/png", "image/x-png", "image/tiff"]
            var validExtension = $.inArray(type, fileTypes) !== -1;
            return validExtension;
     });

    $.validator.addMethod("maxfilesize",
     function (value, element, param) {

         var fileSize = $(element)[0].files[0].size;
         var maxSize = 1048576;

         var validSize = fileSize < maxSize;
         return validSize;
     });

    $.validator.unobtrusive.adapters.add('fileextensions', [], function (options) {
        var params = {
            fileextensions: $(options.element).data("val-fileextensions").split(',')
        };

        options.rules['fileextensions'] = params;    
        options.messages['fileextensions'] = $(options.element).data("val-fileextensions");

    });

    $.validator.unobtrusive.adapters.add('maxfilesize', [], function (options) {

        options.rules['maxfilesize'] = [];
        options.messages['maxfilesize'] = $(options.element).data("val-maxfilesize");

    });

我试图重新创建＆＃34;浮动＆＃34; HTML5 Canvas中的效果。我想要做的是试图获得一个图像＆＃34; float＆＃34;上和下。绘制图像并运行float（）函数以计算图像的下一个y位置。我已经让它向下浮动，或向上，但不是如何在图像浮动示例100px（向上或向下）之后改变方向。我该怎么做？

我已在此处上传了画布：https://stuff.darkleaks.net/HTML5%20WP/cheshire/

你可以看到屁股，图像漂浮下来，然后慢下来。停止移动后，我想改变浮动方向。 let i = 0; function float() { yPos += Math.sin(i); i += .01 * yVel; }函数是我尝试执行此操作的地方。

float()

Answer 1

按照问题中的说明在代码中向下浮动

// in the draw function
xPos += xVel;
yPos += yVel;

然后检查yPos是否超过某个点，如果是，则改变方向

const bottom = ctx.canvas.height - 300; // put somewhere with globals 
if(yPos > bottom){ // is pos past bottom
   yVel = -0.5; // change direction
   yPos = bottom; // make sure yPos does not render past bottom
}

顶部

相同

const top = 100; // put somewhere with globals 
if(yPos < top){ // is pos past top
   yVel = 0.5; // change direction
   yPos = top; // make sure yPos does not render past top
}

HTML Canvas浮动效果

1 个答案: