• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] Html innerhalb Javascript// zufälliger Mauscursor

X

xxisaaaaaaaa

New member
Hallo Forengemeinschaft,

ich habe nicht wirklich viel Ahnung vom Programmieren und gestalten von Websiten, also entschuldigt, falls die Frage dumm ist, aber ich habe tatsächlich einiges an zeit verwendet es selbst herauszukriegen und bin leider gescheitert.

Ich wollte auf meinem Blog neue Mauscursor einbauen, und zwar so, dass man zufällig einen von mehreren bekommt. (Vorher hatte ich nur einen, der hat gut funktioniert, also an sich lässt sich so ein anderer fancy Cursor ohne Probleme einbauen).
Nun weiß ich, dass ich mit html weder Zufallszahlen noch if-then-Klauseln machen kann, allerdings mit Javascript und das habe ich dann versucht, aber es hat mit dann leider immer nur den normalen Cursor angezeigt und nicht die besonderen.

Frage also: Wie kann ich innerhalb eines Javascripts html-Codes ausführen bzw. geht das überhaupt oder habe ich da was komplett falsch verstanden? Oder hat jemand einfach einen Vorschlag wie ich oben genannte Idee umsetzen könnte?

danke schonmal und Liebe Grüße
 
Hi,

um Browserübergreifend eigene Cursor nutzen zu können, solltest Du png-Grafiken verwenden. Lediglich der Explorer versteht das nicht.

Du kannst in Deinem JavaScript-Code eine Zufallszahl mittels Math.random ermitteln.

Ungetestetes Beispiel:

HTML: 
<!doctype html>
<html lang="de">
<head>
<title>Cursor-Test</title>
<meta charset="utf-8" />
</head>
<script>
function setzeCursor() {
  // Wir schreiben alle Dateinamen der Grafiken durch Komma getrennt in einen String
  var cursors='grafik1.png,grafik2.png,grafik3.png';
  // Jetzt machen wir ein Array daraus
  cursors=cursors.split(',');
  // Jetzt ermitteln wir eine Zufallszahl zwischen 0 und Anzahl-1
  var c=Math.floor(Math.random()*cursors.length);
  // Jetzt setzen wir den cursor für das Element, "main" (in diesem Beispiel ein div-Element
  document.getElementById('main').style.cursor='url('+cursors[c]+'), default';
}
</script>
<body onload="setzeCursor();">
<div id="main" style="width:200px;height:200px;background:#508030;"></div>
</body>
</html>

Jetzt musst Du nur noch die Namen der Grafiken auf Deine Verhältnisse anpassen.

Nachtrag:
Die Dateinamen dürfen natürlich kein Komma enthalten.
 
Also wir können jetzt gerne jede Zeile diskutieren, etwa das Fehlen des parameters type="text/javascript" im <script>-Tag.

Die Lösung wurde zusammengezimmert und da er angab, keine Erfahrungen zu haben, war ich der Meinung, ein String mit eindeutigem Anfang und Ende ist für ihn einfacher zu editieren, als ein mehrzeiliges Array.

Naja, soviel dazu...
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben