andrea6767: Grafik als Cursor in Firefox

Hallo!

Zuerst: es gibt bereits einen Forumseintrag zu diesem Thema: eigener Cursor. Ich habe auch die dort aufgeführten Tipps befolgt. Leider besteht mein Problem weiterhin:

Im Safari funktioniert das Ändern des Cursors in eine eigene Grafik wunderbar - nur leider nicht im Firefox (Mozilla/5.0 (Macintosh; U; Intel Mac OS X; de; rv:1.8.1.17) Gecko/20080829 Firefox/2.0.0.17).

Ich wäre für jede Hilfe sehr dankbar. :-)

Grüße von Andrea

P.S.: hier noch mein Script:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />  
<style type="text/css">
~~~~~~css
  
body {  
 background-color:#999;  
 color:#066;  
 font-family:Geneva, Arial, Helvetica, sans-serif;  
 font-size:14px;  
 width:640px;  
}  
  
h1, h2, h3 { text-align:center; font-weight:normal; }  
  
fieldset {  
 margin:1em; padding:1em; text-align:center;  
}  
  
.buttonUp {  
 background-color:#999;  
 background-image:url(../../Bilder/buttons/buttonUp.png);  
 background-repeat:no-repeat;  
 width:100px;  
 height:20px;  
 outline:none;  
 border:0;  
 cursor:pointer;  
 margin-right:1em;  
 padding-bottom:0.4em;  
}  
  
.buttonOver {  
 background-color:#999;  
 background-image:url(../../Bilder/buttons/buttonOver.png);  
 background-repeat:no-repeat;  
 width:100px;  
 height:20px;  
 outline:none;  
 border:0;  
 cursor:pointer;  
 margin-right:1em;  
 padding-bottom:0.4em;  
 color:#FFFFCC;  
}  
  
.buttonDown {  
 background-color:#999;  
 background-image:url(../../Bilder/buttons/buttonDown.png);  
 background-repeat:no-repeat;  
 width:100px;  
 height:20px;  
 outline:none;  
 border:0;  
 cursor:pointer;  
 margin-right:1em;  
 padding-bottom:0.4em;  
 color:#FFFFCC;  
}  
  
.mittigerText {  
 text-align:center;  
}  
  
#mausform {  
 width:500px;  
 height:300px;  
 margin:auto;  
 margin-top:50px;  
}  
  
.maus1 {  
 cursor:url("../../Bilder/mauszeiger/maus_1.png"), w-resize;  
}  
  
.maus2 {  
 cursor:url("../../Bilder/mauszeiger/maus_2.png"), e-resize;  
}
  
</style>  
<script type="text/javascript">
~~~~~~javascript
  
 function init() {  
  btn = window.document.getElementById('mauszeiger');  
 }  
  
 function maus(nr) {  
  //<![CDATA[  
  // mozilla requires CDATA tags for this script,  
  btn.className = 'maus'+nr;  
  window.document.getElementById('maus'+nr).className = 'buttonDown';  
  //]]>  
 };
  
</script>  
<script type="text/javascript" src="../scripts/buttons.js"></script>  
<title>2.3.10. Mauszeiger ver&auml;ndern - JavaScript-Beispiele von Andrea</title>  
</head>  
  
<body onload="init();">  
<div id="mauszeiger">  
  
<h1>2.3.10. Das Aussehen des Mauszeigers verändern</h1>  
  
<p class="mittigerText">Klicken Sie die Buttons, um das Aussehen des Mauszeigers zu verändern.</p>  
  
<form action="" method="get" name="mausform" id="mausform">  
  
 <fieldset>  
  
 <input id="maus1" name="maus1" class="buttonUp" onmouseover="buttonOVER(this)" onmousedown="maus(1)" onmouseup="buttonOVER(this)" onmouseout="buttonUP(this)" type="button" value="Spirale" />  
  
 <input id="maus2" name="maus2" class="buttonUp" onmouseover="buttonOVER(this)" onmousedown="maus(2)" onmouseup="buttonOVER(this)" onmouseout="buttonUP(this)" type="button" value="Smiley" />  
  
 </fieldset>  
  
</form>  
  
</div>  
  
</body>  
</html>
  1. Mahlzeit andrea6767,

    Zuerst: es gibt bereits einen Forumseintrag zu diesem Thema: eigener Cursor. Ich habe auch die dort aufgeführten Tipps befolgt.

    ... allerdings anscheinend nicht in http://de.selfhtml.org/css/eigenschaften/anzeigefenster.htm#cursor-url@title=SELFHTML nachgeschlagen - Zitat:

    "Nicht alle Browser unterstützen alle Grafikformate und auch nicht unter allen Betriebssystemen."

    MfG,
    EKKi

    --
    sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
    1. Hallo EKKi!

      Erstmal Danke für Deine Antwort.

      ... allerdings anscheinend nicht in http://de.selfhtml.org/css/eigenschaften/anzeigefenster.htm#cursor-url@title=SELFHTML nachgeschlagen - Zitat:

      "Nicht alle Browser unterstützen alle Grafikformate und auch nicht unter allen Betriebssystemen."

      Doch, habe ich auch gelesen. Aber soll das heißen, dass man das ausprobieren muss? Oder kennst Du vielleicht eine Quelle, wo man die richtige Kombination ablesen kann? Ich habe schon bei Firefox geschaut, aber nichts gefunden.

      Grüße von Andrea

      1. Hallo,

        eine Quelle, wo man die richtige Kombination ablesen kann?

        ich denke mal, das das hier helfen sollte ...

        MfG. Christoph Ludwig

        --
        Wo die Sprache aufhört, fängt die Musik an...
        Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
        Go to this
        1. Hallo Christoph!

          Vielen Dank für Deine Antwort! Ja, das hilft mir. :-)

          Grüße von Andrea