Jasmina

• 

  1.2.21

• 

  3.2.21

• 

  3.2.21

• 

  3.2.21

• 

  4.2.21

• 

  4.2.21

• 

  4.2.21

• 

  4.2.21

• 

  9.2.21

• 

  9.2.21

• 

  9.2.21

• 

  9.2.21

• 

  9.2.21

Die oben deklarierte Variable Counter bestimmt die Position des sich bewegenden Kreises. Sie wird regelmäßig um 20 erhöht, wodurch sich die Position des Kreises weiter Richtung rechts unten bewegt. Der Kreis ist jedoch nur sichtbar, wenn man nicht auf den Bildbereich klickt. Die vertikalen und horizontalen rosa Streifen werden durch eine for-Schleife erzeugt, welche immer an der Position (50 + i, i) eine 10 Pixel breites (vertikale Streifen) oder 10 Pixel hohes (horizontale Strifen) Rechteck malt. Die Länge der Streifen wird durch `width/2` bestimmt und beträgt somit die halbe Breite des Bildes.

var c;

let counter = 0;

function setup() {

 c = createCanvas(windowWidth-20, windowHeight-20);
 frameRate(10);

}

function draw() {

 background(190);
 noStroke();
 counter = counter + 20; 
   if (counter >= 0.25 * width) {
   counter = 0;
 }
if (! mouseIsPressed) {
     fill(255,105,180);
     ellipse(90 + 4 * counter,50 + 4 * counter,80,80);
   }
 for (let i = 0- 80 ; i < height; i += 20) {
   fill(255,105,180);
   rect(50 + i, i, width / 2, 10);
   fill(255,105,180);
   rect(50 + i, i, 10, width / 2);
 }

}

Neue Sortierung der Bilder der sortierten Tableaus: