Moz tauscht BG-Image hin, aber nicht zurück

[Ole]

hi

ein glück ist abzusehen das die archivsuche in naher zukunft keine probleme mehr macht...in den letzten tagen mag sie mich garnicht mehr und sagt mir immer das sie für mich nicht arbeiten will/kann :(.

mein problem:

ich habe ein kleines javascript, das die hintergrundgrafik einer tabellenzelle beim überfahren mit der maus austauschen soll und wenn die maus die zelle verläßt das ganze wieder rückgängig macht. eigentlich kein problem hab ich mir gedacht und folgendes script gebastelt:

<script type="text/javascript">
  function rollover(NAME)
  {
  if (document.getElementById(NAME).style.backgroundImage == "url(images/roll_over.jpg)")
   {
   document.getElementById(NAME).style.backgroundImage = "url(images/1x1.gif)";
   }
  else
   {
   document.getElementById(NAME).style.backgroundImage = "url(images/roll_over.jpg)";
   }
  }
</script>

Der IE tauscht hin und zurück ohne Probleme, doch Mozilla tauscht nur hin und ignoriert es wenn die maus die entsprechende zelle verläßt.

Mag sein das es zu früh für mich ist, aber ich finde den Fehler nicht *Seuftz*.

das ganze wird folgendermaßen aufgerufen:
<td class="ueber" id="Home" onmouseover="rollover('Home');" onmouseout="rollover('Home');">Home</td>

thx
ole
(8-)>

[Ole]

ich nochmal

tja, man muß natürlich erstmal daruaf kommen das der mozilla den absoluten pfad zum bild benutzt und nicht wie der ie den relativen.

die lösung des problems sieht so aus:

<script type="text/javascript">
 function rollover(NAME)
 {
 if (document.getElementById(NAME).style.backgroundImage.indexOf("roll_over.jpg")!=-1)
  {document.getElementById(NAME).style.backgroundImage = "url(images/1x1.gif)";}
 else
  {document.getElementById(NAME).style.backgroundImage = "url(images/roll_over.jpg)";}
 }
</script>

jetzt funktioniert es *seuftz*...doch noch zu früh für mich...oder mir ist heute morgen beim rollerfahren einfach das hirn eingefrohren.

so long
ole
(8-)>

[Markus Dippold]

Hi,

ein ähnliches Problem habe ich auch.
Mal sehen, ob es auch den relative oder absoluten Pfaden liegt. Werde es ausprobieren, wenn ich mal Zeit habe.

Problem sieht so aus:
Wenn Du den Internet Explorer 6.x hast, rufe einfach mal ein beliebige Seite im Bereich Star Trek ( bei www.dippold.org ) auf und klicke auf einen beliebigen Amazon- oder Vote-Button.
Das erste Mal geht's gut.
Auf einen weiteren beliebigen Button (kann auch der gleiche sein) klicken.
Was fällt auf? Der ursprüngliche Button kommt nicht wieder. Das ist kein Problem meines Rechners hier, ich habe es noch mit drei anderen PCs ausprobiert, überall das gleiche.

Dieses Problem tritt auch nur mit dem IE 6 auf (Opera und Netscape verhalten sich nicht so zickig) und auch nur dann, wenn man die Seite online, sprich aus dem Web, abruft. Lokal von der Platte habe ich das Problem nicht. Obwohl im Need for Speed-Teil die gleichen Funktionen verwendet werden (alles in der Datei javascripts.js), klappt es hier.
Wer's mal probieren will: Need for Speed -> Fahrzeuge, die Buttons unten 0-9, A..Z und Pursuit.

Der einzige Unterschied, den ich sehe, ist, daß in der Buchstabenleiste von NFS jeder Button seine eigenen beiden Wechselgrafiken hat, beim Star Trek-Teil aber nur insgesamt vier Grafiken (zweimal Amazon und zweimal Vote) für beliebig viele Buttons vorhanden sind. Eindeutige Namen (IDs) sind aber vorhanden.
Wenn jemand hierzu eine Idee hat, dann bin ich offen dafür. Ich habe schon alles Mögliche ausprobiert, Scripten durchgesteppt usw., aber ich habe bis dato einfach keine Idee, woran es liegen könnte.

Was ist auch der Unterschied, wenn ich das Zeug lokal abfahre oder aus dem Web aufrufe? Ein Link ist ein Link, dachte ich bisher immer.

Ich muß da mal eine Browserweiche einbauen (obwohl ich sowas eigentlich blöde finde) und schauen, was passiert.

Gruß,
Markus

[MudGuard]

Hi,

function rollover(NAME)
  {

setze hier mal
alert(document.getElementById(NAME).style.backgroundImage)
ein. Und guck Dir das genau an - Anführungszeichen und so...

if (document.getElementById(NAME).style.backgroundImage == "url(images/roll_over.jpg)")

cu,
Andreas

[Struppi]

Hallo Ole

hi

ein glück ist abzusehen das die archivsuche in naher zukunft keine probleme mehr macht...in den letzten tagen mag sie mich garnicht mehr und sagt mir immer das sie für mich nicht arbeiten will/kann :(.

mein problem:

ich habe ein kleines javascript, das die hintergrundgrafik einer tabellenzelle beim überfahren mit der maus austauschen soll und wenn die maus die zelle verläßt das ganze wieder rückgängig macht. eigentlich kein problem hab ich mir gedacht und folgendes script gebastelt:

<script type="text/javascript">
  function rollover(NAME)
  {
  if (document.getElementById(NAME).style.backgroundImage == "url(images/roll_over.jpg)")
   {
   document.getElementById(NAME).style.backgroundImage = "url(images/1x1.gif)";
   }
  else
   {
   document.getElementById(NAME).style.backgroundImage = "url(images/roll_over.jpg)";
   }
  }
</script>

Der IE tauscht hin und zurück ohne Probleme, doch Mozilla tauscht nur hin und ignoriert es wenn die maus die entsprechende zelle verläßt.

Mag sein das es zu früh für mich ist, aber ich finde den Fehler nicht *Seuftz*.

das ganze wird folgendermaßen aufgerufen:
<td class="ueber" id="Home" onmouseover="rollover('Home');" onmouseout="rollover('Home');">Home</td>

Das liesse sich einfacher mit CSS lösen

.ueber_home
{
background: url(images/1x1.gif);
}

Wobei ich vermute das das sogar überflüssig ist.

.ueber_home:hover
{
url(images/roll_over.jpg);
}

Struppi.

[MudGuard]

Hi,

<td class="ueber" id="Home" onmouseover="rollover('Home');" onmouseout="rollover('Home');">Home</td>
.ueber_home
{
background: url(images/1x1.gif);

Warnung: background setzt erstmal alle Einzel-Eigenschaften (background-position, -repeat, ...) auf die initial-Werte und überschreibt dann nur die tatsächlich angegebenen... (siehe http://www.w3.org/TR/REC-CSS2/colors.html#propdef-background)
Wenn wirklich nur das Bild gesetzt werden soll, sollte man daher background-image benutzen.

}
Wobei ich vermute das das sogar überflüssig ist.
.ueber_home:hover

Das betroffene Element ist ein td. Leider ist der Marktführer unter den Browsern nicht in der Lage, :hover für ein td korrekt darzustellen.

{
url(images/roll_over.jpg);

hier fehlt natürlich noch das background-image:

}

cu,
Andreas

[Struppi]

<td class="ueber" id="Home" onmouseover="rollover('Home');" onmouseout="rollover('Home');">Home</td>
.ueber_home
{
background: url(images/1x1.gif);

Warnung: background setzt erstmal alle Einzel-Eigenschaften (background-position, -repeat, ...) auf die initial-Werte und überschreibt dann nur die tatsächlich angegebenen... (siehe http://www.w3.org/TR/REC-CSS2/colors.html#propdef-background)
Wenn wirklich nur das Bild gesetzt werden soll, sollte man daher background-image benutzen.

Klar, war nur als Anregung gedacht.

}
Wobei ich vermute das das sogar überflüssig ist.
.ueber_home:hover

Das betroffene Element ist ein td. Leider ist der Marktführer unter den Browsern nicht in der Lage, :hover für ein td korrekt darzustellen.

Na und, ein Grund es nicht zu benutzen? Schließlich ist es relativ unbedeutend ob ein Mouseover Bild erscheint oder nicht.

Darüber hinaus würd ich auch davon ausgehen, das statt einer Tabelle eine Liste mehr Sinn macht (und die Links als Blockelemente deklarieren) dann kann man ohne JS diesen Effekt auch mit dem IE erreichen.

Struppi.

[Struppi]

Darüber hinaus würd ich auch davon ausgehen, das statt einer Tabelle eine Liste mehr Sinn macht (und die Links als Blockelemente deklarieren) dann kann man ohne JS diesen Effekt auch mit dem IE erreichen.

Als Ergänzung vielleicht noch das hier: http://css.maxdesign.com.au/listamatic/

Struppi.