✔ Falsche Rollover-Darstellung im IE

[HoneyKiSs]

Hi Leute,
ich weiß nicht wo ich das rein machen soll meine Frage. Ich denke mal ich mach es hier rein weil ein HTML Code folgt.

Also, ich habe mit Dreamweaver cs3 Rolloverbuttons für die Bildergalerie auf der Website erstellt. Wenn man auf eine Minibildvorschau drückt kommt vorm Bild ein graue Streifenbildchen. Im Firefox funktioniert das ganze ohne Probleme, im Netscape auch. Im Opera macht er den Rollovereffekt bei den ersten 3 oberen Bilder nicht darunter aber alles normal und im Google Chrome das selbe Probleme.

Aber was mich am meisten stört das er im IE8 alles falsch darstellt. Der Rollovereffekt erscheint entweder im Headbild oder wenn ich unten das letzte anklicke erscheint es oben alles kreuz und quer.

Ich verstehe nicht warum das so falsch gezeigt wird. das ist ganz ganz großer mist ist das. hier ist mal der Code. von der ersten Zeile von 3 Bildern und die Website dazu, vielleicht kann jemand mal selbst gucken was da los ist also so ein Problem hatte ich noch nie und dabei ist die Website valide? http://www.surfdochmal.de/

Danke schon mal

<table border="0" cellpadding="0" cellspacing="0" class="bildboxtabelle">
      <tr>
        <td class="ueberschrift">Princess Nails</td>
        <td class="ueberschrift">Brushwork</td>
        <td class="ueberschrift">Werbebanner</td>
      </tr>
      <tr>
        <td><div class="bildbox"><a href="#bild11" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('11','','images/hover.jpg',1)"><img src="images/11.jpg" alt=" " name="11" width="200" height="120" border="0"></a>
        </div></td>
        <td><div class="bildbox"><a href="#bild12" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('12','','images/hover.jpg',1)"><img src="images/12.jpg" alt=" " name="12" width="200" height="120" border="0"></a></div></td>
        <td><div class="bildbox"><a href="#bild13" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('13','','images/hover.jpg',1)"><img src="images/13.jpg" alt=" " name="13" width="200" height="120" border="0"></a></div></td>
      </tr>
      <tr>
        <td class="detailtext">Logogestaltung | mit Corel Draw</td>
        <td><span class="detailtext">Flyer | ohne weiteren Text</span></td>
        <td><span class="detailtext">Werbebanner | für eine Homepage</span></td>
      </tr>
    </table>

 

[Maik]

Moin,

als mögliche Fehlerquelle tippe ich mal auf deine Bezeichner in den name-Attributen, die gemäß der Attribut-Referenz nicht mit einer Ziffer beginnen dürfen - siehe http://de.selfhtml.org/html/referenz/attribute.htm#id_idref_name.

mfg Maik

 

[HoneyKiSs]

huhu,

also ich hab bei den ersten 3 bildern wie hier der html code, bei name bild vor die zahle gesetzt. aber das problem ist immer noch

<td><div class="bildbox"><a href="#bild11" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('11','','images/hover.jpg',1)"><img src="images/11.jpg" alt=" " name="bild11" width="200" height="120" border="0"></a>
        </div></td>

oder liegt hier ein fehler im code? aber das ist ja der rollovercode vom dreamweaver.

<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

 

[Maik]

Zumindest solltest du dann auch hier den Bezeichner umbenennen:

 onmouseover="MM_swapImage('bild11','','images/hover.jpg',1)"

Und für den weiteren Verlauf des Dokuments anderslautende Ankernamen vorsehen, da sie somit in den name-Attributen jeweils zweimal existieren, was nicht regelkonform ist.

Princess Nails<a name="bild11">

mfg Maik

 

[HoneyKiSs]

oh WOOOO du bist ja ein Schatz jetzt gehts ^^ juhuuu
das dies nur an dem doofen namen lag. die oberen 3 bilder funktionieren jetzt wie sie sollen auch im ie
die anderen muss ich dann noch machen.

und was ich noch fragen wollte. was meintest du jetzt mit dem ankernamen umbenennen die heißen bild11 bild12 usw. das hab ich ned so ganz verstanden was du meintest

aber sonst vielen vielen dank ich freu mich ^^

 

[Maik]

Beispielsweise das Attribut name="bild11" taucht in deinem Quellcode einmal im <img>-Element, und zum anderen im <a>-Element auf. Hier mußt du noch eine entsprechende Namensänderung vornehmen, damit es keine doppelte Namensnennung mehr in diesen beiden Attributen gibt.

Das gilt selbstverständlich auch für die anderen Elemente.

mfg Maik

 

[HoneyKiSs]

hallo vielen dank jetzt ist es auch wieder valide. der validator hat mich noch drauf hingewiesen wegen dem ankernamen hab einfach statt bild anker gneommen. mir ist kein besseres wort eingefallen. jetzt sollte doch alles passen zumindest bei den ersten 3 bildern ich denke das dort auch keine beginnende zahl erlaubt ist.