Jó az IE-ben , de nem jó a mozzillában

[ZsoltiD]

Szevasztok!

 

Egy nagy problémám akadt a weboldal szerkesztés közben.

Onmouseoverral megpróbáltam csinálni menügombokat, hogy amikor felé viszem az egeret akkor más képet mutasson, és ez mûködik is meg minden (és ezt photoshoppal kreáltam) és az a baj hogy amint hozzáérek pl a táblázat méretét tekintve , egybõl elcseszõdik (ami úgy néz ki hogy minden jól mutat, csak amikor felé viszem az egeret nem lesz változás), és csak IE-ben lesz jó.

Ez miéárt van, hogy tudnám megoldani, hogy jó legyen minden bongészõ alatt?

Itt van a script:

<script type="text/javascript"><!--
var preloadFlag = false;
function preloadImages() {
    if (document.images) {
        Izsop_tortenetg_over = newImage('images/Izsop_tortenetg-over.jpg');
        Izsopka_tortenetg_over = newImage('images/Izsopka_tortenetg-over.jpg');
        Izsop_fotoalbumg_over = newImage('images/Izsop_fotoalbumg-over.jpg');
        Izsopka_fotoalbg_over = newImage('images/Izsopka_fotoalbg-over.jpg');
        Izsop_vendegkg_over = newImage('images/Izsop_vendegkg-over.jpg');
        Izsopka_hirek_over = newImage('images/Izsopka_hirek-over.jpg');
        Izsop_diszkogrg_over = newImage('images/Izsop_diszkogrg-over.jpg');
        Izsopka_diszkog_over = newImage('images/Izsopka_diszkog-over.jpg');
        Izsop_hirek_over = newImage('images/Izsop_hirek-over.jpg');
        Izsop_rolunkg_over = newImage('images/Izsop_rolunkg-over.jpg');
        preloadFlag = true;
    }
}

// --></script>

 

És itt van a kód pl az egyik gonbmbhoz:

<td colspan="2" height="28">
            <a href="izsop-tortenet.html"
                onmouseover="changeImages('Izsop_tortenetg', 'images/Izsop_tortenetg-over.jpg'); return true;"
                onmouseout="changeImages('Izsop_tortenetg', 'images/Izsop_tortenetg.jpg'); return true;"
                onmousedown="changeImages('Izsop_tortenetg', 'images/Izsop_tortenetg-over.jpg'); return true;"
                onmouseup="changeImages('Izsop_tortenetg', 'images/Izsop_tortenetg-over.jpg'); return true;">
                <img name="Izsop_tortenetg" src="images/Izsop_tortenetg.jpg" width="152" height="28" border="0" alt=""></a></td>

 

Kérlek segítsetek, most ez nagyon fontos lenne!

 

Köszi!

Üdv.:

D. Zsolti

[Szerdahelyi Gergely]

Ez inkább kitérő válasz, de én Rollover Image-ként szoktam menügombokat csinálni. A keresők is jobban szeretik és működik minden böngészővel.

 

www.mithras.hu ez pl. így készült.

 

Fontos: a képeknek megegyező méretűnek kell lennie, mert amúgy torzulás vagy elcsúszás lesz

[ZsoltiD]

Üdv!

 

Sikerült megoldanom a problémát egy scripttel, de itt meg pont fordítva van az egész, mármint úgy értem, hogy most már Mozzillában jó, de most meg Internet explorer húzza szét valamiért a menüket.

Itt nézzétek meg IE-el és mozzillával is egyaránt:

http://izsop.extra.hu/main.html

 

A js kódja:

<script language="javascript">
<!-- A JavaScript kód elrejtése

browserNev = navigator.appName;
browserVer = parseInt(navigator.appVersion);

if (browserNev == "Netscape" && browserVer >= 3) 
  browserVer = "1";
else if (browserNev == "Microsoft Internet Explorer" && browserVer == 4)
  browserVer = "1";
else browserVer = "2";

if (browserVer == 1){
  i1 = new Image(); i1.src = "images/Izsop_tortenetg.jpg";
  i2 = new Image(); i2.src = "images/Izsop_tortenetg-over.jpg";
  i3 = new Image(); i3.src = "images/Izsopka_tortenetg.jpg";
  i4 = new Image(); i4.src = "images/Izsopka_tortenetg-over.jpg";
  i5 = new Image(); i5.src = "images/Izsop_fotoalbumg.jpg";
  i6 = new Image(); i6.src = "images/Izsop_fotoalbumg-over.jpg";
  i7 = new Image(); i7.src = "images/Izsopka_fotoalbg.jpg";
  i8 = new Image(); i8.src = "images/Izsopka_fotoalbg-over.jpg";
  i9 = new Image(); i9.src = "images/Izsop_vendegkg.jpg";
  i10 = new Image(); i10.src = "images/Izsop_vendegkg-over.jpg";
  i11 = new Image(); i11.src = "images/Izsopka_hirek.jpg";
  i12 = new Image(); i12.src = "images/Izsopka_hirek-over.jpg";
  i13 = new Image(); i13.src = "images/Izsop_diszkogrg.jpg";
  i14 = new Image(); i14.src = "images/Izsop_diszkogrg-over.jpg";
  i15 = new Image(); i15.src = "images/Izsopka_diszkog.jpg";
  i16 = new Image(); i16.src = "images/Izsopka_diszkog-over.jpg";
  i17 = new Image(); i17.src = "images/Izsop_hirek.jpg";
  i18 = new Image(); i18.src = "images/Izsop_hirek-over.jpg";
  i19 = new Image(); i19.src = "images/Izsop_rolunkg.jpg";
  i20 = new Image(); i20.src = "images/Izsop_rolunkg-over.jpg";
}

function mutat(kep_nev,kep_obj){
  if (browserVer == 1)
    document.images[kep_nev].src = kep_obj.src;
}

// -->
</script>

 

és a menüsorozat egy része:

...
<td colspan="2" rowspan="2" valign="top" height="28">
<a href="izsop-fotoalbum.html" onMouseOver="mutat('link5',i6)" onMouseOut="mutat('link5',i5)">
<img name="link5" src="images/Izsop_fotoalbumg.jpg" width="152" height="28" border="0" alt=""></a>
</td>
                <td height="1">
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
            </tr>
    <tr height="27">
        <td colspan="2" rowspan="2" valign="top" height="28">
<a href="izsopka-fotoalbum.html" onMouseOver="mutat('link7',i8)" onMouseOut="mutat('link7',i7)">
<img name="link7" src="images/Izsopka_fotoalbg.jpg" width="150" height="28" border="0" alt=""></a>
</td>
                <td height="27">
            <img src="images/spacer.gif" width="1" height="27" alt=""></td>
            </tr>
    <tr height="1">
        <td colspan="2" rowspan="2" valign="top" height="28">
<a href="izsop-izsopka-vendegkonyv.html" onMouseOver="mutat('link9',i10)" onMouseOut="mutat('link9',i9)">
<img name="link9" src="images/Izsop_vendegkg.jpg" width="152" height="28" border="0" alt=""></a>
</td>
...

 

Szerintetek hol lehet a probléma?

 

Üdv.:

Zsolti

[atikovi]

Érdekes, nálam a Mozilla Firefox-ban és Internet Explorerben is ugyanúgy néz ki, nálam nincsen különbség... nincsen semmi széthúzás.

[ZsoltiD]

Nálam a függőleges menük között az Internet Explorerben több függőlegesen a hely, és az első bal oldali menüpont mellett is van egy kis képszakadás.