• Python画爱心——谁能拒绝用代码敲出会跳动的爱心呢~


    还不快把这份浪漫拿走!!节日就快到来了,给Ta一个惊喜吧~

     今天给大家分享一个浪漫小技巧,利用Python中的 HTML 制作一个立体会动的心动小爱心

    成千上百个爱心汇成一个大爱心,从里到外形成一个立体状,给人视觉上的冲击感!浪漫极了↓

    V:hw13980

    话不多说上才艺: 


     
       
       


         
         
         
         
       

    部分代码

      (function () {
          var b = 0;
          var c = ["ms", "moz", "webkit", "o"];
          for (var a = 0; a < c.length && !window.requestAnimationFrame; ++a) {
            window.requestAnimationFrame = window[c[a] + "RequestAnimationFrame"];
            window.cancelAnimationFrame =
              window[c[a] + "CancelAnimationFrame"] ||
              window[c[a] + "CancelRequestAnimationFrame"];
          }
          if (!window.requestAnimationFrame) {
            window.requestAnimationFrame = function (h, e) {
              var d = new Date().getTime();
              var f = Math.max(0, 16 - (d - b));
              var g = window.setTimeout(function () {
                h(d + f);
              }, f);
              b = d + f;
              return g;
            };
          }
          if (!window.cancelAnimationFrame) {
            window.cancelAnimationFrame = function (d) {
              clearTimeout(d);
            };
          }
        })();

        /*
         *Point class
         */
        var Point = (function () {
          function Point(x, y) {
            this.x = typeof x !== "undefined" ? x : 0;
            this.y = typeof y !== "undefined" ? y : 0;
          }
          Point.prototype.clone = function () {
            return new Point(this.x, this.y);
          };
          Point.prototype.length = function (length) {
            if (typeof length == "undefined")
              return Math.sqrt(this.x * this.x + this.y * this.y);
            this.normalize();
            this.x *= length;
            this.y *= length;
            return this;
          };
          Point.prototype.normalize = function () {
            var length = this.length();
            this.x /= length;
            this.y /= length;
            return this;
          };
          return Point;
        })();

        /*
         * Particle class
         */
        var Particle = (function () {
          function Particle() {
            this.position = new Point();
            this.velocity = new Point();
            this.acceleration = new Point();
            this.age = 0;
          }
          Particle.prototype.initialize = function (x, y, dx, dy) {
            this.position.x = x;
            this.position.y = y;
            this.velocity.x = dx;
            this.velocity.y = dy;
            this.acceleration.x = dx * settings.particles.effect;
            this.acceleration.y = dy * settings.particles.effect;
            this.age = 0;
          };
          Particle.prototype.update = function (deltaTime) {
            this.position.x += this.velocity.x * deltaTime;
            this.position.y += this.velocity.y * deltaTime;
            this.velocity.x += this.acceleration.x * deltaTime;
            this.velocity.y += this.acceleration.y * deltaTime;
            this.age += deltaTime;
          };
          Particle.prototype.draw = function (context, image) {
            function ease(t) {
              return --t * t * t + 1;
            }
            var size = image.width * ease(this.age / settings.particles.duration);
            context.globalAlpha = 1 - this.age / settings.particles.duration;
            context.drawImage(
              image,
              this.position.x - size / 2,
              this.position.y - size / 2,
              size,
              size
            );
          };
          return Particle;
        })();

    运行结果:

  • 相关阅读:
    15年架构师:再有面试官问你Kafka,就拿这篇学习笔记怼他
    花一星期折腾后,我劝你好好考虑下书签同步这个问题
    软件合同保密协议
    C++lambda表达式
    vBox+K8s坑记录
    NC5 二叉树根节点到叶子节点的所有路径和
    深入理解ThreadLocal
    Java+Tif图片转Jpg
    python3.8安装selenium报错
    vue入门-->前后端分离&vue简介,vue入门,vue生命周期
  • 原文地址:https://blog.csdn.net/m0_72557783/article/details/127859414