志在指尖
用双手敲打未来

html文本框代码怎么写(跳动爱心代码html)

html文本框代码怎么写

html文本框代码:1、单行文本框【<inputtype=”text”style=”height:..;width:..;”/>】;2、多行文本框【textareastyle=”;height:;”></textare】。
本教程操作环境:windows7系统、html5版,DELLG3电脑。
html文本框代码:
1、单行文本框:
<inputtype=”text”style=”height:20px;width:100px;”/>
2、多行文本框(文本域):
<textareastyle=”width:300px;height:100px;”></textarea>
文本框是单行的,而文本域可以输入多行,不过文本框也可以通过设置变成成多行。html

跳动爱心代码html

<!DOCTYPEHTMLPUBLIC“-//W3C//DTDHTML4.0Transitional//EN”><HTML>
<HEAD>
<TITLE>NewDocument</TITLE>
<METANAME=”Generator”CONTENT=”EditPlus”>
<METANAME=”Author”CONTENT=””>
<METANAME=”Keywords”CONTENT=””>
<METANAME=”Description”CONTENT=””>
<style>
html,body{
height:100%;
padding:0;
margin:0;
background:#000;
}
canvas{
position:absolute;
width:100%;
height:100%;
}
</style>
</HEAD>
<BODY>
<canvasid=”pinkboard”></canvas>
<script>
/*
*Settings
*/
varsettings={
particles:{
length:500,//maximumamountofparticles
duration:2,//particledurationinsec
velocity:100,//particlevelocityinpixels/sec
effect:-0.75,//playwiththisforaniceeffect
size:30,//particlesizeinpixels
},
};
/*
*RequestAnimationFramepolyfillbyErikM?ller
*/
(function(){varb=0;varc=[“ms”,”moz”,”webkit”,”o”];for(vara=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){vard=newDate().getTime();varf=Math.max(0,16-(d-b));varg=window.setTimeout(function(){h(d+f)},f);b=d+f;returng}}if(!window.cancelAnimationFrame){window.cancelAnimationFrame=function(d){clearTimeout(d)}}}());
/*
*Pointclass
*/
varPoint=(function(){
functionPoint(x,y){
this.x=(typeofx!==‘undefined’)?x:0;
this.y=(typeofy!==‘undefined’)?y:0;
}
Point.prototype.clone=function(){
returnnewPoint(this.x,this.y);
};
Point.prototype.length=function(length){
if(typeoflength==‘undefined’)
returnMath.sqrt(this.x*this.x+this.y*this.y);
this.normalize();
this.x*=length;
this.y*=length;
returnthis;
};
Point.prototype.normalize=function(){
varlength=this.length();
this.x/=length;
this.y/=length;
returnthis;
};
returnPoint;
})();
/*
*Particleclass
*/
varParticle=(function(){
functionParticle(){
this.position=newPoint();
this.velocity=newPoint();
this.acceleration=newPoint();
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){
functionease(t){
return(–t)*t*t+1;
}
varsize=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);
};
returnParticle;
})();
/*
*ParticlePoolclass
*/
varParticlePool=(function(){
varparticles,
firstActive=0,
firstFree=0,
duration=settings.particles.duration;
functionParticlePool(length){
//createandpopulateparticlepool
particles=newArray(length);
for(vari=0;i<particles.length;i++)
particles[i]=newParticle();
}
ParticlePool.prototype.add=function(x,y,dx,dy){
particles[firstFree].initialize(x,y,dx,dy);
//handlecircularqueue
firstFree++;
if(firstFree==particles.length)firstFree=0;
if(firstActive==firstFree)firstActive++;
if(firstActive==particles.length)firstActive=0;
};
ParticlePool.prototype.update=function(deltaTime){
vari;
//updateactiveparticles
if(firstActive<firstFree){
for(i=firstActive;i<firstFree;i++)
particles[i].update(deltaTime);
}
if(firstFree<firstActive){
for(i=firstActive;i<particles.length;i++)
particles[i].update(deltaTime);
for(i=0;i<firstFree;i++)
particles[i].update(deltaTime);
}
//removeinactiveparticles
while(particles[firstActive].age>=duration&&firstActive!=firstFree){
firstActive++;
if(firstActive==particles.length)firstActive=0;
}
};
ParticlePool.prototype.draw=function(context,image){
//drawactiveparticles
if(firstActive<firstFree){
for(i=firstActive;i<firstFree;i++)
particles[i].draw(context,image);
}
if(firstFree<firstActive){
for(i=firstActive;i<particles.length;i++)
particles[i].draw(context,image);
for(i=0;i<firstFree;i++)
particles[i].draw(context,image);
}
};
returnParticlePool;
})();
/*
*Puttingitalltogether
*/
(function(canvas){
varcontext=canvas.getContext(‘2d’),
particles=newParticlePool(settings.particles.length),
particleRate=settings.particles.length/settings.particles.duration,//particles/sec
time;
//getpointonheartwith-PI<=t<=PI
functionpointOnHeart(t){
returnnewPoint(
160*Math.pow(Math.sin(t),3),
130*Math.cos(t)–50*Math.cos(2*t)–20*Math.cos(3*t)–10*Math.cos(4*t)+25
);
}
//creatingtheparticleimageusingadummycanvas
varimage=(function(){
varcanvas=document.createElement(‘canvas’),
context=canvas.getContext(‘2d’);
canvas.width=settings.particles.size;
canvas.height=settings.particles.size;
//helperfunctiontocreatethepath
functionto(t){
varpoint=pointOnHeart(t);
point.x=settings.particles.size/2+point.x*settings.particles.size/350;
point.y=settings.particles.size/2–point.y*settings.particles.size/350;
returnpoint;
}
//createthepath
context.beginPath();
vart=-Math.PI;
varpoint=to(t);
context.moveTo(point.x,point.y);
while(t<Math.PI){
t+=0.01;//babysteps!
point=to(t);
context.lineTo(point.x,point.y);
}
context.closePath();
//createthefill
context.fillStyle=‘#ea80b0’;
context.fill();
//createtheimage
varimage=newImage();
image.src=canvas.toDataURL();
returnimage;
})();
//renderthatthing!
functionrender(){
//nextanimationframe
requestAnimationFrame(render);
//updatetime
varnewTime=newDate().getTime()/1000,
deltaTime=newTime–(time||newTime);
time=newTime;
//clearcanvas
context.clearRect(0,0,canvas.width,canvas.height);
//createnewparticles
varamount=particleRate*deltaTime;
for(vari=0;i<amount;i++){
varpos=pointOnHeart(Math.PI–2*Math.PI*Math.random());
vardir=pos.clone().length(settings.particles.velocity);
particles.add(canvas.width/2+pos.x,canvas.height/2–pos.y,dir.x,-dir.y);
}
//updateanddrawparticles
particles.update(deltaTime);
particles.draw(context,image);
}
//handle(re-)sizingofthecanvas
functiononResize(){
canvas.width=canvas.clientWidth;
canvas.height=canvas.clientHeight;
}
window.onresize=onResize;
//delayrenderingbootstrap
setTimeout(function(){
onResize();
render();
},10);
})(document.getElementById(‘pinkboard’));
</script>
</BODY>
</HTML>

未经允许不得转载:IT技术网站 » html文本框代码怎么写(跳动爱心代码html)
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

志在指尖 用双手敲打未来

登录/注册IT技术大全

热门IT技术

C#基础入门   SQL server数据库   系统SEO学习教程   WordPress小技巧   WordPress插件   脚本与源码下载