Grafik als Cursor in Firefox
andrea6767
- browser
0 EKKi- css
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ä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>
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
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
Hallo Christoph!
Vielen Dank für Deine Antwort! Ja, das hilft mir. :-)
Grüße von Andrea