html火焰文字特效

下面是代码:

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>HTML5火焰文字特效DEMO演示</title><link rel="stylesheet" href="css/style.css" media="screen" type="text/css" /></head><body>
<div style="text-align:center;clear:both;position:absolute;top:10px;left:260px;z-index:999">
<script src="/gg_bd_ad_720x90.js" type="text/javascript"></script>
<script src="/follow.js" type="text/javascript"></script>
</div><div id="canvasContainer"></div><span id="textInputSpan">Your name (max 10 chars) :<input id="textInput" maxlength="10" type="text" width="150" /><button onclick="changeText()">GO!</button>
</span><script src="js/index.js"></script></body></html>

style.css:

html, body{margin : 0px;width : 100%;height : 100%;overflow: hidden;background-color: #000000;font-family: sans-serif;
}#canvasContainer{margin : 0px;width : 100%;height : 100%;
}#textInputSpan{position: absolute;color: #FFFFFF;font-family: sans-serif;
}

index.js:
 

/** Stats.js 1.1* http://code.google.com/p/mrdoob/wiki/stats_js**/function Stats()
{this.init();
}Stats.prototype ={init: function(){this.frames = 0;this.framesMin = 100;this.framesMax = 0;this.time = new Date().getTime();this.timePrev = new Date().getTime();this.container = document.createElement("div");this.container.style.position = 'absolute';this.container.style.fontFamily = 'Arial';this.container.style.fontSize = '10px';this.container.style.backgroundColor = '#000020';this.container.style.opacity = '0.9';this.container.style.width = '80px';this.container.style.paddingTop = '2px';this.framesText = document.createElement("div");this.framesText.style.color = '#00ffff';this.framesText.style.marginLeft = '3px';this.framesText.style.marginBottom = '3px';this.framesText.innerHTML = '<strong>FPS</strong>';this.container.appendChild(this.framesText);this.canvas = document.createElement("canvas");this.canvas.width = 74;this.canvas.height = 30;this.canvas.style.display = 'block';this.canvas.style.marginLeft = '3px';this.canvas.style.marginBottom = '3px';this.container.appendChild(this.canvas);this.context = this.canvas.getContext("2d");this.context.fillStyle = '#101030';this.context.fillRect(0, 0, this.canvas.width, this.canvas.height );this.contextImageData = this.context.getImageData(0, 0, this.canvas.width, this.canvas.height);setInterval( bargs( function( _this ) { _this.update(); return false; }, this ), 1000 );},getDisplayElement: function(){return this.container;},tick: function(){this.frames++;},update: function(){this.time = new Date().getTime();this.fps = Math.round((this.frames * 1000 ) / (this.time - this.timePrev)); //.toPrecision(2);this.framesMin = Math.min(this.framesMin, this.fps);this.framesMax = Math.max(this.framesMax, this.fps);this.framesText.innerHTML = '<strong>' + this.fps + ' FPS</strong> (' + this.framesMin + '-' + this.framesMax + ')';this.contextImageData = this.context.getImageData(1, 0, this.canvas.width - 1, 30);this.context.putImageData(this.contextImageData, 0, 0);this.context.fillStyle = '#101030';this.context.fillRect(this.canvas.width - 1, 0, 1, 30);this.index = ( Math.floor(30 - Math.min(30, (this.fps / 60) * 30)) );this.context.fillStyle = '#80ffff';this.context.fillRect(this.canvas.width - 1, this.index, 1, 1);this.context.fillStyle = '#00ffff';this.context.fillRect(this.canvas.width - 1, this.index + 1, 1, 30 - this.index);this.timePrev = this.time;this.frames = 0;}
}// Hack by Spitefunction bargs( _fn )
{var args = [];for( var n = 1; n < arguments.length; n++ )args.push( arguments[ n ] );return function () { return _fn.apply( this, args ); };
}(function (window){var Sakri = window.Sakri || {};window.Sakri = window.Sakri || Sakri;Sakri.MathUtil = {};//return number between 1 and 0Sakri.MathUtil.normalize = function(value, minimum, maximum){return (value - minimum) / (maximum - minimum);};//map normalized number to valuesSakri.MathUtil.interpolate = function(normValue, minimum, maximum){return minimum + (maximum - minimum) * normValue;};//map a value from one set to anotherSakri.MathUtil.map = function(value, min1, max1, min2, max2){return Sakri.MathUtil.interpolate( Sakri.MathUtil.normalize(value, min1, max1), min2, max2);};Sakri.MathUtil.hexToRgb = function(hex) {// Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;hex = hex.replace(shorthandRegex, function(m, r, g, b) {return r + r + g + g + b + b;});var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);return result ? {r: parseInt(result[1], 16),g: parseInt(result[2], 16),b: parseInt(result[3], 16)} : null;}Sakri.MathUtil.getRandomNumberInRange = function(min, max){return min + Math.random() * (max - min);};Sakri.MathUtil.getRandomIntegerInRange = function(min, max){return Math.round(Sakri.MathUtil.getRandomNumberInRange(min, max));};}(window));//has a dependency on Sakri.MathUtil(function (window){var Sakri = window.Sakri || {};window.Sakri = window.Sakri || Sakri;Sakri.Geom = {};//==================================================//=====================::POINT::====================//==================================================Sakri.Geom.Point = function (x,y){this.x = isNaN(x) ? 0 : x;this.y = isNaN(y) ? 0 : y;};Sakri.Geom.Point.prototype.clone = function(){return new Sakri.Geom.Point(this.x,this.y);};Sakri.Geom.Point.prototype.update = function(x, y){this.x = isNaN(x) ? this.x : x;this.y = isNaN(y) ? this.y : y;};//==================================================//===================::RECTANGLE::==================//==================================================Sakri.Geom.Rectangle = function (x, y, width, height){this.update(x, y, width, height);};Sakri.Geom.Rectangle.prototype.update = function(x, y, width, height){this.x = isNaN(x) ? 0 : x;this.y = isNaN(y) ? 0 : y;this.width = isNaN(width) ? 0 : width;this.height = isNaN(height) ? 0 : height;};Sakri.Geom.Rectangle.prototype.getRight = function(){return this.x + this.width;};Sakri.Geom.Rectangle.prototype.getBottom = function(){return this.y + this.height;};Sakri.Geom.Rectangle.prototype.getCenter = function(){return new Sakri.Geom.Point(this.getCenterX(), this.getCenterY());};Sakri.Geom.Rectangle.prototype.getCenterX = function(){return this.x + this.width/2;};Sakri.Geom.Rectangle.prototype.getCenterY=function(){return this.y + this.height/2;};Sakri.Geom.Rectangle.prototype.containsPoint = function(x, y){return x >= this.x && y >= this.y && x <= this.getRight() && y <= this.getBottom();};Sakri.Geom.Rectangle.prototype.clone = function(){return new Sakri.Geom.Rectangle(this.x, this.y, this.width, this.height);};Sakri.Geom.Rectangle.prototype.toString = function(){return "Rectangle{x:"+this.x+" , y:"+this.y+" , width:"+this.width+" , height:"+this.height+"}";};}(window));/*** Created by sakri on 27-1-14.* has a dependecy on Sakri.Geom* has a dependecy on Sakri.BitmapUtil*/(function (window){var Sakri = window.Sakri || {};window.Sakri = window.Sakri || Sakri;Sakri.CanvasTextUtil = {};//returns the biggest font size that best fits into given widthSakri.CanvasTextUtil.getFontSizeForWidth = function(string, fontProps, width, canvas, fillStyle, maxFontSize){if(!canvas){var canvas = document.createElement("canvas");}if(!fillStyle){fillStyle = "#000000";}if(isNaN(maxFontSize)){maxFontSize = 500;}var context = canvas.getContext('2d');context.font = fontProps.getFontString();context.textBaseline = "top";var copy = fontProps.clone();//console.log("getFontSizeForWidth() 1  : ", copy.fontSize);context.font = copy.getFontString();var textWidth = context.measureText(string).width;//SOME DISAGREEMENT WHETHER THIS SHOOULD BE WITH && or ||if(textWidth < width){while(context.measureText(string).width < width){copy.fontSize++;context.font = copy.getFontString();if(copy.fontSize > maxFontSize){console.log("getFontSizeForWidth() max fontsize reached");return null;}}}else if(textWidth > width){while(context.measureText(string).width > width){copy.fontSize--;context.font = copy.getFontString();if(copy.fontSize < 0){console.log("getFontSizeForWidth() min fontsize reached");return null;}}}//console.log("getFontSizeForWidth() 2  : ", copy.fontSize);return copy.fontSize;};//=========================================================================================//==============::CANVAS TEXT PROPERTIES::====================================//========================================================Sakri.CanvasTextProperties = function(fontWeight, fontStyle, fontSize, fontFace){this.setFontWeight(fontWeight);this.setFontStyle(fontStyle);this.setFontSize(fontSize);this.fontFace = fontFace ? fontFace : "sans-serif";};Sakri.CanvasTextProperties.NORMAL = "normal";Sakri.CanvasTextProperties.BOLD = "bold";Sakri.CanvasTextProperties.BOLDER = "bolder";Sakri.CanvasTextProperties.LIGHTER = "lighter";Sakri.CanvasTextProperties.ITALIC = "italic";Sakri.CanvasTextProperties.OBLIQUE = "oblique";Sakri.CanvasTextProperties.prototype.setFontWeight = function(fontWeight){switch (fontWeight){case Sakri.CanvasTextProperties.NORMAL:case Sakri.CanvasTextProperties.BOLD:case Sakri.CanvasTextProperties.BOLDER:case Sakri.CanvasTextProperties.LIGHTER:this.fontWeight = fontWeight;break;default:this.fontWeight = Sakri.CanvasTextProperties.NORMAL;}};Sakri.CanvasTextProperties.prototype.setFontStyle = function(fontStyle){switch (fontStyle){case Sakri.CanvasTextProperties.NORMAL:case Sakri.CanvasTextProperties.ITALIC:case Sakri.CanvasTextProperties.OBLIQUE:this.fontStyle = fontStyle;break;default:this.fontStyle = Sakri.CanvasTextProperties.NORMAL;}};Sakri.CanvasTextProperties.prototype.setFontSize = function(fontSize){if(fontSize && fontSize.indexOf && fontSize.indexOf("px")>-1){var size = fontSize.split("px")[0];fontProperites.fontSize = isNaN(size) ? 24 : size;//24 is just an arbitrary numberreturn;}this.fontSize = isNaN(fontSize) ? 24 : fontSize;//24 is just an arbitrary number};Sakri.CanvasTextProperties.prototype.clone = function(){return new Sakri.CanvasTextProperties(this.fontWeight, this.fontStyle, this.fontSize, this.fontFace);};Sakri.CanvasTextProperties.prototype.getFontString = function(){return this.fontWeight + " " + this.fontStyle + " " + this.fontSize + "px " + this.fontFace;};}(window));window.requestAnimationFrame =window.__requestAnimationFrame ||window.requestAnimationFrame ||window.webkitRequestAnimationFrame ||window.mozRequestAnimationFrame ||window.oRequestAnimationFrame ||window.msRequestAnimationFrame ||(function () {return function (callback, element) {var lastTime = element.__lastTime;if (lastTime === undefined) {lastTime = 0;}var currTime = Date.now();var timeToCall = Math.max(1, 33 - (currTime - lastTime));window.setTimeout(callback, timeToCall);element.__lastTime = currTime + timeToCall;};})();var readyStateCheckInterval = setInterval( function() {if (document.readyState === "complete") {clearInterval(readyStateCheckInterval);init();}
}, 10);//========================
//general properties for demo set up
//========================var canvas;
var context;
var canvasContainer;
var htmlBounds;
var bounds;
var minimumStageWidth = 250;
var minimumStageHeight = 250;
var maxStageWidth = 1000;
var maxStageHeight = 600;
var resizeTimeoutId = -1;
var stats;function init(){canvasContainer = document.getElementById("canvasContainer");window.onresize = resizeHandler;stats = new Stats();canvasContainer.appendChild( stats.getDisplayElement() );commitResize();
}function getWidth( element ){return Math.max(element.scrollWidth,element.offsetWidth,element.clientWidth );}
function getHeight( element ){return Math.max(element.scrollHeight,element.offsetHeight,element.clientHeight );}//avoid running resize scripts repeatedly if a browser window is being resized by dragging
function resizeHandler(){context.clearRect(0,0,canvas.width, canvas.height);clearTimeout(resizeTimeoutId);clearTimeoutsAndIntervals();resizeTimeoutId = setTimeout(commitResize, 300 );
}function commitResize(){if(canvas){canvasContainer.removeChild(canvas);}canvas = document.createElement('canvas');canvas.style.position = "absolute";context = canvas.getContext("2d");canvasContainer.appendChild(canvas);htmlBounds = new Sakri.Geom.Rectangle(0,0, getWidth(canvasContainer) , getHeight(canvasContainer));if(htmlBounds.width >= maxStageWidth){canvas.width = maxStageWidth;canvas.style.left = htmlBounds.getCenterX() - (maxStageWidth/2)+"px";}else{canvas.width = htmlBounds.width;canvas.style.left ="0px";}if(htmlBounds.height > maxStageHeight){canvas.height = maxStageHeight;canvas.style.top = htmlBounds.getCenterY() - (maxStageHeight/2)+"px";}else{canvas.height = htmlBounds.height;canvas.style.top ="0px";}bounds = new Sakri.Geom.Rectangle(0,0, canvas.width, canvas.height);context.clearRect(0,0,canvas.width, canvas.height);if(bounds.width<minimumStageWidth || bounds.height<minimumStageHeight){stageTooSmallHandler();return;}var textInputSpan = document.getElementById("textInputSpan");textInputSpan.style.top = htmlBounds.getCenterY() + (bounds.height/2) + 20 +"px";textInputSpan.style.left = (htmlBounds.getCenterX() - getWidth(textInputSpan)/2)+"px";startDemo();
}function stageTooSmallHandler(){var warning = "Sorry, bigger screen required :(";context.font = "bold normal 24px sans-serif";context.fillText(warning, bounds.getCenterX() - context.measureText(warning).width/2, bounds.getCenterY()-12);
}//========================
//Demo specific properties
//========================var animating = false;
var particles = [];
var numParticles = 4000;
var currentText = "SAKRI";
var fontRect;
var fontProperties = new Sakri.CanvasTextProperties(Sakri.CanvasTextProperties.BOLD, null, 100);
var animator;
var particleSource = new Sakri.Geom.Point();;
var particleSourceStart = new Sakri.Geom.Point();
var particleSourceTarget = new Sakri.Geom.Point();var redParticles = ["#fe7a51" , "#fdd039" , "#fd3141"];
var greenParticles = ["#dbffa6" , "#fcf8fd" , "#99de5e"];
var pinkParticles = ["#fef4f7" , "#f2a0c0" , "#fb3c78"];
var yellowParticles = ["#fdfbd5" , "#fff124" , "#f4990e"];
var blueParticles = ["#9ca2df" , "#222a6d" , "#333b8d"];var particleColorSets = [redParticles, greenParticles, pinkParticles, yellowParticles, blueParticles];
var particleColorIndex = 0;var renderParticleFunction;
var renderBounds;
var particleCountOptions = [2000, 4000, 6000, 8000, 10000, 15000, 20000 ];
var pixelParticleCountOptions = [10000, 40000, 60000, 80000, 100000, 150000 ];function clearTimeoutsAndIntervals(){animating = false;
}function startDemo(){fontRect = new Sakri.Geom.Rectangle(Math.floor(bounds.x + bounds.width*.2), 0, Math.floor(bounds.width - bounds.width*.4), bounds.height);fontProperties.fontSize = 100;fontProperties.fontSize = Sakri.CanvasTextUtil.getFontSizeForWidth(currentText, fontProperties, fontRect.width, canvas);fontRect.y = Math.floor(bounds.getCenterY() - fontProperties.fontSize/2);fontRect.height = fontProperties.fontSize;renderBounds = fontRect.clone();renderBounds.x -= Math.floor(canvas.width *.1);renderBounds.width += Math.floor(canvas.width *.2);renderBounds.y -= Math.floor(fontProperties.fontSize *.5);renderBounds.height += Math.floor(fontProperties.fontSize *.6);context.font = fontProperties.getFontString();createParticles();context.globalAlpha = globalAlpha;animating = true;loop();
}function loop(){if(!animating){return;}stats.tick();renderParticles();window.requestAnimationFrame(loop, canvas);
}function createParticles(){context.clearRect(0,0,canvas.width, canvas.height);context.fillText(currentText, fontRect.x, fontRect.y);var imageData = context.getImageData(fontRect.x, fontRect.y, fontRect.width, fontRect.height);var data = imageData.data;var length = data.length;var rowWidth = fontRect.width*4;var i, y, x;particles = [];for(i=0; i<length; i+=4){if(data[i+3]>0){y = Math.floor(i / rowWidth);x = fontRect.x + (i - y * rowWidth) / 4;particles.push(x);//xparticles.push(fontRect.y + y);//yparticles.push(x);//xOriginparticles.push(fontRect.y + y);//yOrigin}}//console.log(particles.length);context.clearRect(0,0,canvas.width, canvas.height);//pre calculate random numbers used for particle movementxDirections = [];yDirections = [];for(i=0; i<directionCount; i++){xDirections[i] = -7 + Math.random() * 14;yDirections[i] = Math.random()* - 5;}
}var xDirections, yDirections;
//fidget with these to manipulate effect
var globalAlpha = .11; //amount of trails or tracers
var xWind = 0; //all particles x is effected by this
var threshold = 60; //if a pixels red component is less than this, return particle to it's original position
var amountRed = 25; //amount of red added to a pixel occupied by a particle
var amountGreen = 12; //amount of green added to a pixel occupied by a particle
var amountBlue = 1; //amount of blue added to a pixel occupied by a particle
var directionCount = 100; //number of random pre-calculated x and y directionsfunction renderParticles(){//fill renderBounds area with a transparent black, and render a nearly black textcontext.fillStyle = "#000000";context.fillRect(renderBounds.x, renderBounds.y, renderBounds.width, renderBounds.height);context.fillStyle = "#010000";context.fillText(currentText, fontRect.x, fontRect.y);var randomRed = amountRed -5 + Math.random()*10;var randomGreen = amountGreen -2 + Math.random()*4;var imageData = context.getImageData(renderBounds.x, renderBounds.y, renderBounds.width, renderBounds.height);var data = imageData.data;var rowWidth = imageData.width * 4;var index, i, length = particles.length;var d = Math.floor(Math.random()*30);xWind += (-.5 + Math.random());//move randomly left or rightxWind = Math.min(xWind, 1.5);//clamp to a maximum windxWind = Math.max(xWind, -1.5);//clamp to a minimum windfor(i=0; i<length; i+=4, d++ ){particles[i] += (xDirections[d % directionCount] + xWind);particles[i+1] += yDirections[d % directionCount];index = Math.round(particles[i] - renderBounds.x) * 4 + Math.round(particles[i+1] - renderBounds.y) * rowWidth;data[index] += randomRed;data[index + 1] += randomGreen;data[index + 2] += amountBlue;//if pixels red component is below set threshold, return particle to orginif( data[index] < threshold){particles[i] = particles[i+2];particles[i+1] = particles[i+3];}}context.putImageData(imageData, renderBounds.x, renderBounds.y);
}var maxCharacters = 10;function changeText(){var textInput = document.getElementById("textInput");if(textInput.value && textInput.text!=""){if(textInput.value.length > maxCharacters){alert("Sorry, there is only room for "+maxCharacters+" characters. Try a shorter name.");return;}if(textInput.value.indexOf(" ")>-1){alert("Sorry, no support for spaces right now :(");return;}currentText = textInput.value;clearTimeoutsAndIntervals();animating = false;setTimeout(commitResize, 100);}
}function changeSettings(){clearTimeoutsAndIntervals();animating = false;setTimeout(commitResize, 100);
}function setParticleNumberOptions(values){var selector = document.getElementById("particlesSelect");if(selector.options.length>0 && parseInt(selector.options[0].value) == values[0] ){return;}while(selector.options.length){selector.remove(selector.options.length-1);}for(var i=0;i <values.length; i++){selector.options[i] = new Option(values[i], values[i], i==0, i==0);}
}

运行效果:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/644188.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

2024.1.23 GNSS 零散知识 学习笔记

1.天线种类 2.接收机 2.四大导航系统的介绍 3.卫星高度与轨道卫星种类 4.GNSS有哪些应用 5.在空间保持静⽌或匀速直线运动(⽆加速度)的坐标系称为惯性坐标系。 6.地⼼惯性坐标系实际上并没有满⾜能成为惯性坐标系的条件&#xff1a; ⾸先&#xff0c;地球及其质⼼都在围绕太阳…

[计算机提升] 切换(域)用户

4.14 切换(域)用户 4.14.1 为什么要切换用户 在Windows系统中&#xff0c;切换用户的主要目的是为了实现多用户共享同一台计算机的便利和安全。当多个人需要使用同一台计算机时&#xff0c;每个人可以登录自己的用户账户&#xff0c;这样可以避免互相干扰和混淆数据。 以下是…

《深入解析Java虚拟机:从JVM体系结构到垃圾回收算法》

文章目录 JVM体系结构JVM的组成 类加载器Class Loader类加载器的作用双亲委派机制JVM自带三个类加载器Bootstrap ClassLoader-根加载器ExtClassLoader-扩展加载器AppClassLoader-应用类加载器 Java历史-沙箱安全机制沙箱概念沙箱的作用本地代码和远程代码沙箱安全机制模型JDK1 …

C语言快速排序(非递归)图文详解

前言&#xff1a; 上一期分析了快速排序的三种写法&#xff0c;这三种写法有一个相同点&#xff0c;都是采用递归形式来实现的&#xff0c;那么有没有非递归的方法实现呢&#xff1f;答案是当然有&#xff0c;用非递归的方法实现快速排序&#xff0c;其实可以借助数据结构中的栈…

【LangChain学习之旅】—(10) 用RouterChain确定客户意图

【【LangChain学习之旅】—&#xff08;10&#xff09; 用RouterChain确定客户意图 任务设定整体框架具体步骤如下&#xff1a; 具体实现构建提示信息的模板构建目标链 Reference&#xff1a;LangChain 实战课 任务设定 首先&#xff0c;还是先看一下今天要完成一个什么样的任…

《鸟哥的Linux私房菜》第1章——总结与简答题回答

目录 一、什么是Linux&#xff0c;有什么作用&#xff1f; 二、Linux发展史 三、Linux发行版 四、简答题部分 一、什么是Linux&#xff0c;有什么作用&#xff1f; Linux包括内核和系统调用两部分&#xff0c;是位于硬件设备与应用程序中间的操作系统。 操作系统其实也是…

多维时序 | Matlab实现GWO-TCN-Multihead-Attention灰狼算法优化时间卷积网络结合多头注意力机制多变量时间序列预测

多维时序 | Matlab实现GWO-TCN-Multihead-Attention灰狼算法优化时间卷积网络结合多头注意力机制多变量时间序列预测 目录 多维时序 | Matlab实现GWO-TCN-Multihead-Attention灰狼算法优化时间卷积网络结合多头注意力机制多变量时间序列预测效果一览基本介绍程序设计参考资料 效…

python爬虫代码示例:爬取京东详情页图片

python爬虫代码示例:爬取京东详情页图片 一、Requests安装及示例 爬虫爬取网页内容首先要获取网页的内容&#xff0c;通过requests库进行获取。 GitHub: https://github.com/requests/requests PyPl: https://pypi.python.org/pypi/requests 官方文档:http://wwwpython-requ…

Java可以用于物联网的开发吗?

Java可以用于物联网的开发吗? 在开始前我有一些资料&#xff0c;是我根据网友给的问题精心整理了一份「Java的资料从专业入门到高级教程」&#xff0c; 点个关注在评论区回复“888”之后私信回复“888”&#xff0c;全部无偿共享给大家&#xff01;&#xff01;&#xff01;J…

web安全学习笔记【06】——http\https抓包

思维导图放最后 #知识点&#xff1a; 1、Web常规-系统&中间件&数据库&源码等 2、Web其他-前后端&软件&Docker&分配站等 3、Web拓展-CDN&WAF&OSS&反向&负载均衡等 ----------------------------------- 1、APP架构-封装&原生态&…

SpringBoot集成mybatis时idea控制台中文乱码问题解决

在application.yml中配置好映射文件打印数据库日志文件时&#xff0c;控制台出现乱码的情况解决如下 问题 在执行查询操作的时候&#xff0c;查询时可以查看是没有问题的&#xff0c;但是控制台乱码了 解决 在File-Setting-Editor-File Encodings中设置如图所示就可以了 现在…

软件测试之功能测试详解

一、测试项目启动与研读需求文档 &#xff08;一&#xff09; 组建测试团队 1、测试团队中的角色 2、测试团队的基本责任 尽早地发现软件程序、系统或产品中所有的问题。督促和协助开发人员尽快地解决程序中的缺陷。帮助项目管理人员制定合理的开发和测试计划。对缺陷进行跟…

业余爱好-生物信息学/生物化学/物理/统计学/政治/数学/概率论/AI/AGI/区块链

生物信息学 高等数学—元素和极限-实数的定义高等数学—元素和极限-实数的元素个数高等数学—元素和极限-自然数个数少于实数个数高等数学—元素和极限-无穷大之比较高等数学—元素和极限-级数的收敛高等数学—元素和极限-极限的定义数学分析与概率论人工智能AI数学基础——全套…

http503错误是什么原因

HTTP503错误在站长圈很经常遇到&#xff0c;很多网站站长经常遇到的HTTP503错误经常会不知道怎么去解决它。今天我们就来针对HTTP503错误问题展开说说。HTTP503错误是指服务器暂时无法处理客户端的请求&#xff0c;常常出现在服务器超负荷或维护期间。在这种情况下&#xff0c;…

HTML 入门手册(二)

目录 HTML 入门手册(一) 10-表单 11-input标签 11.1文本框 (text) 11.2密码框 (password) 11.3单选按钮 (radio) 11.4复选框 (checkbox) 11.5普通按钮 11.6提交按钮 (submit) 11.7重置按钮 (reset) 11.8隐藏域 (hidden) 11.9文件上传 (file) 11.10数字输入 (numbe…

2024年上海高考数学最后四个多月的备考攻略,目标140+

亲爱的同学们&#xff0c;寒假已经来临&#xff0c;春节即将到来&#xff0c;距离2024年上海高考已经余额不足5个月了。作为让许多学子头疼&#xff0c;也是拉分大户的数学科目&#xff0c;你准备好了吗&#xff1f;今天&#xff0c;六分成长为您分享上海高考数学最后四个多月的…

Sulfo Cy3 hydrazide,磺化-Cy3-酰肼,可用于与生物分子的羰基衍生物偶联

您好&#xff0c;欢迎来到新研之家 文章关键词&#xff1a;Sulfo-Cyanine3-hydrazide&#xff0c;Sulfo Cy3 hydrazide&#xff0c;Sulfo Cyanine3 HZ&#xff0c;磺化 Cy3 酰肼&#xff0c;磺化-Cy3-酰肼 一、基本信息 产品简介&#xff1a;Sulfo-Cyanine3-hydrazide能够与…

【GitHub项目推荐--人脸识别】【转载】

01 带有移动应用程序的人脸识别库 OpenFace 作为用于人脸识别的通用库&#xff0c;能够实现瞬态和移动人脸识别&#xff0c;目前在 GitHub 上斩获 14291 Star。以下为 LFW 数据集 Sylvestor Stallone 输入单个图像的流程。 项目地址&#xff1a;https://github.com/cmusatya…

用python写一个双色球中奖模拟器

先说规则&#xff1a; 一等奖&#xff1a;投注号码与当期开奖号码全部相同&#xff08;顺序不限&#xff0c;下同&#xff09;&#xff0c;即中奖&#xff1b; 二等奖&#xff1a;投注号码与当期开奖号码中的6个红色球号码相同&#xff0c;即中奖&#xff1b; 三等奖&#xf…

ai智能写作软件有分享吗?分享4款解放双手的软件!

随着人工智能技术的不断发展&#xff0c;AI智能写作软件逐渐成为内容创作者们的新宠。这些软件不仅能够帮助我们快速生成高质量的文本内容&#xff0c;还能在优化搜索引擎排名等方面发挥重要作用。本文将为大家介绍几款常用的AI智能写作软件&#xff0c;让您轻松提升内容创作效…