请我不知道为什么代码不适用于IE 11浏览器,但在Chrome浏览器工作。为什么不能在IE浏览器上工作?
检查,U刚需复制,并通过浏览器保存本代码为HTML文件,然后打开。
我需要在IE浏览器中运行。我检查了很多方法,但无法解决问题。
IE浏览器报告我的错误在这行代码的48,但不知道为什么!
<!doctype html>
<head><meta http-equiv="X-UA-Compatible" content="IE=11" charset="uft-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.4/p5.min.js"></script>
</head>
<body>
<style>
html,
body {
height: 100%;
}
body {
color: #222;
background: #ededed;
font-family: Arial, sans-serif;
font-size: 14px;
line-height: 1.3;
margin: 0;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
canvas {
border: 1px solid silver;
background: white;
cursor: -webkit-grab;
display: block;
}
</style>
<script>
let nouvelle,
ancienne,
pression;
let themeCouleur = [
'#f44336', '#e91e63', '#9c27b0', '#673ab7', '#3f51b5',
'#2196f3', '#03a9f4', '#00bcd4', '#009688', '#4CAF50',
'#8BC34A', '#CDDC39', '#FFEB3B', '#FFC107', '#FF9800',
'#FF5722'
];
class Particule {
constructor(parent) {
this.parent = parent;
this.gravite = parent.gravite;
this.reinit();
this.forme = round(random(0, 1));
this.etape = 0;
this.prise = 0;
this.priseFacteur = random(-0.02, 0.02);
this.multFacteur = random(0.01, 0.08);
this.priseAngle = 0;
this.priseVitesse = 0.05;
}
reinit() {
this.position = this.parent.position.copy();
this.position.y = random(-20, -100);
this.position.x = random(0, width);
this.velocite = createVector(random(-6, 6), random(-10, 2));
this.friction = random(0.995, 0.98);
this.taille = round(random(5, 15));
this.moitie = this.taille/2;
this.couleur = color(random(themeCouleur));
}
dessiner() {
this.etape = 0.5 + Math.sin(this.velocite.y * 20) * 0.5;
this.prise = this.priseFacteur + Math.cos(this.priseAngle) * this.multFacteur;
this.priseAngle += this.priseVitesse;
translate(this.position.x, this.position.y);
rotate(this.velocite.x * 2);
scale(1, this.etape);
noStroke();
fill(this.couleur);
if (this.forme === 0) {
rect(-this.moitie, -this.moitie, this.taille, this.taille);
} else {
ellipse(0, 0, this.taille, this.taille);
}
resetMatrix();
}
integration() {
this.velocite.add(this.gravite);
this.velocite.x += this.prise;
this.velocite.mult(this.friction);
this.position.add(this.velocite);
if (this.position.y > height) {
this.reinit();
}
if (this.position.x < 0) {
this.reinit();
}
if (this.position.x > width + 10) {
this.reinit();
}
}
rendu() {
this.integration();
this.dessiner();
}
}
class SystemeDeParticules {
constructor(nombreMax, position, gravite) {
this.position = position.copy();
this.nombreMax = nombreMax;
this.gravite = createVector(0, 0.1);
this.friction = 0.98;
// le tableau
this.particules = [];
for (var i = 0; i < this.nombreMax; i++) {
this.particules.push(new Particule(this));
}
}
rendu() {
if (pression) {
var force = p5.Vector.sub(nouvelle, ancienne);
this.gravite.x = force.x/20;
this.gravite.y = force.y/20;
}
this.particules.forEach(particules => particules.rendu());
}
}
let confettis;
function setup() {
createCanvas(windowWidth, windowHeight);
frameRate(60);
ancienne = createVector(0, 0);
nouvelle = createVector(0, 0);
confettis = new SystemeDeParticules(500, createVector(width/2, -20));
}
function draw() {
background(color("#222"));
nouvelle.x = mouseX;
nouvelle.y = mouseY;
confettis.rendu();
ancienne.x = nouvelle.x;
ancienne.y = nouvelle.y;
}
function windowResized() {
resizeCanvas(windowWidth, windowHeight);
confettis.position = createVector(width/2, -40);
}
function mousePressed() {
next = 0;
pression = true;
}
function mouseReleased() {
pression = false;
confettis.gravite.y = 0.1;
confettis.gravite.x = 0;
}
</script>
</body>
</html>
谢谢。
什么是“不行”是什么意思? IE上会发生什么?你看到控制台中的错误吗? – JJJ
你最好做一个jsfiddle。这会帮助你和人们帮助你。 –
是在第48行我在IE浏览器中出错,但是在Chrome工作正常! –