Anleitung für einen Konfetti Regen

RMD1995

Mitglied
Hi,

wir sollen für den Informatikunterricht eine Seite zum Thema Karneval schreiben. Ich habe jetzt alles was wir haben müssen und in HTML schon hatten, teilweise hatten wirs noch nicht^^, eingebaut. Allerdings fehlt mir noch ein Detail, und zwar würde ich gerne im Vordergrund einen Konfetti-regen haben.

Ich habe schon im Netz nachgeforscht und nix gefunden womit man das mit HTML machen könnte. Dann hab ich danach gesucht was man verwenden könnte und bin dabei auf Java-Script gestoßen.

Da ich allerdings überhaupt keine Ahnung in Sachen JS habe hätte ich gerne eure hilfe, ein solches Script zu erstellen.

Könnt ihr mir eine Anleitung erstellen, womit auch ein absoluter Noob in Sachen JS, zu einem Vernünftigen Ergebnis kommt?

Ich hab mir das eigentlich so Vorgestellt:

-Ich mache JPGs von 10 verschiedenen einzelnen Konfetti(s), also z.B. Blaues_Konfetti.jpg(eigentlich nur ein Blauer Punkt^^) ; Grünes_Konfetti.jpg ; Rotes_Konfetti.jpg; ect.
- Ein Zufallsgenerator sollte dann ein zufällige Reihenfolge in der diese Bilder dann „herunteregnen“
-Das sollt in einem Solchen Abstand passieren das man die eigentliche Seite noch lesen kann, der Bildschirm aber trotzdem bedeckt aussieht, sowohl in der Breite als auch in der Höhe. ( Eventuell auch dichterer Konfettiregen, dann sollte es aber aufhören wenn man einen Knopf drückt oder einfach so Klickt, damit man die Seite noch lesen kann.
- Vll. Kann man es so machen das sich das gefallene Konfetti am „Boden“ der Seite sammelt, das muss aber nicht sein.

Ich hoffe ihr Versteht was ich meine^^.

mfg

P.S.: Wenn ihr euch fragt warum ich so etwas einbauen will obwohl wir noch gar kein Java können: Mich interessiert das Thema "programmieren" einfach sehr und wir nehmen auch noch Java durch (ca.2-3Monate), also hab ich mir gedacht warum sollte ich nicht meine HTML-Seite zu einem "Knaller" machen und gleichzeitig noch vor lernen und mich weiter mit programmieren beschäftigen?


Edit: Nach dem Tipp von darkeye2 das Wort Java überall durch JS erstetzt.
 
Zuletzt bearbeitet:

darkeye2

Bekanntes Mitglied
Also ich glaube was du meinst ist JavaScript, nicht Java oder? ein applet ist ja nur an einer festgelegten stelle auf der seite und kann html nicht beeinflüssen, also entweder ist dann deine ganze seite in Java (als applet) oder du realisierst das mit JS
 

RMD1995

Mitglied
Wenn es dann so aussieht als ob das Konfetti "runterregnet" könnte ich das machen.

Dazu müsste ich doch einfach nur ein Konfetti-Regen.gif (einfach versch. farbende Punkte die fallen) erstellen, z.b. in gimp, was die Breite und Höhe meiner Seite hat, oder?

mfg
 

Fitzi21

Aktives Mitglied
Wenn es dann so aussieht als ob das Konfetti "runterregnet" könnte ich das machen.

Dazu müsste ich doch einfach nur ein Konfetti-Regen.gif (einfach versch. farbende Punkte die fallen) erstellen, z.b. in gimp, was die Breite und Höhe meiner Seite hat, oder?

mfg

Auch im Gebiet der Bildbearbeitung muss ich mich als absoluter Anfänger outen, habe mich da meistens auf bereits erstellte Grafiken gestürzt.

Wenn, dann musst du auf jeden Fall auch noch die jeweils Weise Fläche transparent gestalten.

Aber nimm das eher als möglichen Ansatz und verlass dich da auf die Leute, die da was von verstehen (also nicht mich) :D

Wünsche allen noch nen schönen Abend
 

TKausL

Top Contributor
Animierte Gifs würde ich nicht verwenden.
Denn: Entweder legst du das Gif in den Hintergrund, und alle Divs und der Text wird das Gif verdecken, oder du legst es in den Vordergrund, und es verdeckt den Text/die Links, sodass diese nichtmehr anklickbar sind.
Such doch mal nach "JavaScript schnee".
Da gibt es schöne Scripte, schnee rieseln zu lassen. da müsstest du dann ja nurnoch für jede Schneeflocke eine zufallsfarbe generieren lassen.
 

RMD1995

Mitglied
Animierte Gifs würde ich nicht verwenden.
Denn: Entweder legst du das Gif in den Hintergrund, und alle Divs und der Text wird das Gif verdecken, oder du legst es in den Vordergrund, und es verdeckt den Text/die Links, sodass diese nichtmehr anklickbar sind.
Such doch mal nach "JavaScript schnee".
Da gibt es schöne Scripte, schnee rieseln zu lassen. da müsstest du dann ja nurnoch für jede Schneeflocke eine zufallsfarbe generieren lassen.

Dann lass ich das mit dem Gif sein, das macht dann ja wenig sinn.

Leider gibt es, wenn ich ein fertiges Schneeflocken Script nehme, 2 Probleme:

1. Ich gehe davon aus das dann werbung für die ursprungsseite im Quellcode ist und vll. sogar auf meiner seite. Das soll aber auf keinen fall sein.
2. Ich hab keine ahnung wie ich es schaffe, das die Schneeflocken(welche dann ja rund sein müssten und nicht so nen komisches 6-Eck) in mehreren farben fallen, die dann in der reihenfolge auch noch zufällig sein soll.

trotzdem danke für die antwort.

mfg


P.S.: Kennt ihr vll. ein Schneeflocken-Script ohne werbung und wo die Flocken einfache Kreise sind?
 
M

maki

Gast
*verschoben*

Du bist in einem java Forum, nicht in einem JavaScript Forum, deine Chancen wären besser wenn du in einem passendem Forum nachfragen würdest.
 

RMD1995

Mitglied
*verschoben*

Du bist in einem java Forum, nicht in einem JavaScript Forum, deine Chancen wären besser wenn du in einem passendem Forum nachfragen würdest.


Wie du oben siehst dachte ich zuerst ja auch das es zu Java gehört. Aber ich probiers, wie du gesagt hast, jetzt doch mal in einem JS forum.

Trotzdem danke für die Antworten!
 
Ähnliche Java Themen
  Titel Forum Antworten Datum
B Javascript Tutorial für DOM Manipulationen? Angular, React, JQuery - Fragen zu JavaScript 0
R Die Typisierung Service[] ergibt für mich keinen Sinn Angular, React, JQuery - Fragen zu JavaScript 5
Q Typsichers Binding für matSortDirection Angular, React, JQuery - Fragen zu JavaScript 10
N Cookies setzen für Verzeichnis Angular, React, JQuery - Fragen zu JavaScript 4
N Überprüfungsbutton für ein Eingabeformular erstellen Angular, React, JQuery - Fragen zu JavaScript 16
B PullDown erstellen für webseite? Angular, React, JQuery - Fragen zu JavaScript 12
X NegaMax für TicTacToe in JS gewinnt nicht... Angular, React, JQuery - Fragen zu JavaScript 11
P Bildschirmtastatur für Spiele Angular, React, JQuery - Fragen zu JavaScript 6
M Mit Ajax Daten als Eingabe für Dyngraph erzeugen Angular, React, JQuery - Fragen zu JavaScript 6
L [JavaScript] Mehrere Variablen für Live-Suche in MySql-DB Angular, React, JQuery - Fragen zu JavaScript 0
A Hilfe für guten Zweck Angular, React, JQuery - Fragen zu JavaScript 6
J Lese Webseite aus für LinkPreview Angular, React, JQuery - Fragen zu JavaScript 1
A Script für Benachrichtigung Angular, React, JQuery - Fragen zu JavaScript 9
S Suche Lösung für einen Slider mit Textverlinkung Angular, React, JQuery - Fragen zu JavaScript 2
L Suche D3 Tutorial (speziell für Sunburst-Darstellung...) Angular, React, JQuery - Fragen zu JavaScript 2
H Javascript für wordpress "open new window" Angular, React, JQuery - Fragen zu JavaScript 1
N JavaScript für Touch Devices bei DropDown Menü Angular, React, JQuery - Fragen zu JavaScript 4
F Schnellen Browser für HTML mit JS drin. Angular, React, JQuery - Fragen zu JavaScript 6
Fab1 [SUCHE] JavaScript Buch für Umsteiger Angular, React, JQuery - Fragen zu JavaScript 4
K Webapp für Iphone Safari Browser und Links Angular, React, JQuery - Fragen zu JavaScript 6
H HTML5 basierter Client für Webkartendienste auf Smartphones Angular, React, JQuery - Fragen zu JavaScript 2
F Dropdownmenü für JavaScript Angular, React, JQuery - Fragen zu JavaScript 5
S OnKlick für alle Objekte gleicher Art Angular, React, JQuery - Fragen zu JavaScript 17
J Dynamic Markers für POIs aus Postgresdatenbank Angular, React, JQuery - Fragen zu JavaScript 8
H Gadgeterweitung für Kostal Piko Angular, React, JQuery - Fragen zu JavaScript 5
D Kontrollkästchen/Checkbox automatisch aktivieren ! (für Profis) JavaScript Angular, React, JQuery - Fragen zu JavaScript 4
S Javascript für Teamvergabe gesucht. Angular, React, JQuery - Fragen zu JavaScript 4
S Skript für Greasemonkey Angular, React, JQuery - Fragen zu JavaScript 3
C Play und Stop-Error für Musik Angular, React, JQuery - Fragen zu JavaScript 4
A Programmierer für "kleines" Javaprogramm gesucht Angular, React, JQuery - Fragen zu JavaScript 2
G finde Einstellmöglichkeiten für Menue nicht. Angular, React, JQuery - Fragen zu JavaScript 2
M Hilfe gesucht für ein Projekt Angular, React, JQuery - Fragen zu JavaScript 1
K Suche Scrollscript für Objekte Angular, React, JQuery - Fragen zu JavaScript 3
E Fragen zu java Navigation für Internetseite Angular, React, JQuery - Fragen zu JavaScript 2
T Höhe und Breite übergeben für IE! Angular, React, JQuery - Fragen zu JavaScript 2
L Dauerlaufzeile mit Fotos für html Angular, React, JQuery - Fragen zu JavaScript 2
B Einen Timer für Windows Angular, React, JQuery - Fragen zu JavaScript 4
M Script für Namen? Angular, React, JQuery - Fragen zu JavaScript 5
D Inputfeld für Preiseingabe Angular, React, JQuery - Fragen zu JavaScript 6
K Fragen für Praktikum-aber keine Ahnung! Angular, React, JQuery - Fragen zu JavaScript 4
B Zähler für Eingabefeld Angular, React, JQuery - Fragen zu JavaScript 5
D 5 € Musicload Gutschein für Antwort: Formular mit JavaScript Angular, React, JQuery - Fragen zu JavaScript 10
N Java Refresh-Script für Java-Newb Angular, React, JQuery - Fragen zu JavaScript 4
K Bild soll nach 5 Sekunden für 5 Sekunden erscheinen Angular, React, JQuery - Fragen zu JavaScript 5
S Skript für Bannerwechsel Angular, React, JQuery - Fragen zu JavaScript 3
N Java script für detailierten Text anzeigen gesucht Angular, React, JQuery - Fragen zu JavaScript 4
A Timeoutfunktion für JavaScript Angular, React, JQuery - Fragen zu JavaScript 2
L JSON-Daten aus einen Server mit fetch holen Angular, React, JQuery - Fragen zu JavaScript 3
Oskar.p Wie gebe ich einen "Input" einer Website, an einer anderen Stelle wieder aus? Angular, React, JQuery - Fragen zu JavaScript 5
B Quiz Fragen in einem Array nach drücken auf einen Button abfragen Angular, React, JQuery - Fragen zu JavaScript 5
T Ich möchte einen Button mit JavaScript ausblenden Angular, React, JQuery - Fragen zu JavaScript 5
D Ein Skript, dass einen Menühintergrund "faden" kann Angular, React, JQuery - Fragen zu JavaScript 3
M Bilder mit Java in einen Iframe laden Angular, React, JQuery - Fragen zu JavaScript 3
D Mehrere Links mit einen Klick Angular, React, JQuery - Fragen zu JavaScript 4
D wie integriere ich ein java-sript in einen htm-code? Angular, React, JQuery - Fragen zu JavaScript 2
C mehrere <a href > in einen integrieren Angular, React, JQuery - Fragen zu JavaScript 4
G Nach dem Laden der Seite einen JS in einem I-Frame ausführen Angular, React, JQuery - Fragen zu JavaScript 6
C ins Inputfeld einen Text übergeben Angular, React, JQuery - Fragen zu JavaScript 7
S Mouseover mit einen Text? Angular, React, JQuery - Fragen zu JavaScript 4
A Brauche hilfe bei einen Servlet Angular, React, JQuery - Fragen zu JavaScript 8

Ähnliche Java Themen


Oben