geezer: ImageMap Problem in IE

Hallo,
ich habe neulich ein layout gemacht mithilfe von ImageReady (slices) und habe anschließend einen iframe und dann ein ImageMap als Navigation hinzugefügt.
In Firefox und Netscape sieht das layout genauso aus wie ich es will, nur Im Internet Explorer gibt es da Probleme. Denn zwischen dem Bild, welches das ImageMap benutzt, und dem Rest taucht im IE ein weißer Spalt auf und unterbricht das ganze Layout.

Vielleicht wisst ihr was ich meine wenn ihr die seite selbst anschaut:

http://www.totto.beautiful-beast.net/illogical/

Ich vermute, dass das Problem an den Image Maps liegt, denn sobald ich ein map definiere, wird das layout verpfuscht im Internet Explorer.

ich weiß nicht, ob man hier seinen quellcode reinposten kann, von daher hab ichs gelassen (weil man mit dem browser den quelltext auch lesen kann)...

Könnt ihr mir helfen? danke!

  1. Hallo geezer,

    »»» http://www.totto.beautiful-beast.net/illogical/

    Ich vermute, dass das Problem an den Image Maps liegt, denn sobald ich ein map definiere, wird das layout verpfuscht im Internet Explorer.

    Nein, damit hat das bestimmt nichts zu tun, allenfalls damit, dass dein ImageReady-Programm vielleicht die Eigenart hat, bei Zuordnung einer Image-Map gleichzeitig einen Umbruch zwichen den Image-Slice und das schließende TD-Tag zu machen, was bei den übrigen Slices, denen keine Imagemap zugeordnet ist, ja nicht der Fall ist.

    ich weiß nicht, ob man hier seinen quellcode reinposten kann, von daher hab ichs gelassen (weil man mit dem browser den quelltext auch lesen kann)...

      
    <IMG SRC="Bilder/index_02.gif" WIDTH=600 HEIGHT=38 border=0 usemap="#Navigation">  
    </TD>  
    
    

    Ja, das geht wie du siehst. Damit daraus richtiges HTML wird, solltest du aber auf die Quellcodegenerierung durch ImageReady verzichten und es selbst von Hand machen.

    Gruß Gernot

  2. Hallo geezer,

    ich habe mir den Quelltext einmal angesehen. Ein typischer WYSIWYG-Quelltext. Mit ein wenig Eigeninitiative bekommst du das gleiche Ergebnis mit wenigen Zeilen Code sehr viel schlanker und eleganter hin als der umständliche und überflüssige Weg des Editors.

    Einfach ein DIV-Container mit fester Breite und Höhe und das komplette Bild als Hintergrund nehmen. Den IFrame kannst du dann problemlos in den DIV-Container an gewünschter Stelle einbauen.

    Selbst ist der Mann! :)

    MfG,

    McKinsey

    1. Einfach ein DIV-Container mit fester Breite und Höhe und das komplette Bild als Hintergrund nehmen. Den IFrame kannst du dann problemlos in den DIV-Container an gewünschter Stelle einbauen.

      Danke für deine Antwort, nur ich bin noch ziemlich neu, und etwas unsicher: von daher, sorry wenn meine fragen etwas dumm daherkommen...

      Meinst du, das ich dann

      1. ein div über das bild positionieren soll und den iframe dann in den  div container rein machen? Das Image Map kann aber dann bleiben, oder?
      2. das bild nicht mehr slicen, sondern als ganzes benutzen (werden die ladungszeiten dann nicht länger dauern)?
      3. mein layout ist ja jetzt zentriert durch das <div align=center> - wenn ich dann ein anderes div drüber mache, kann ich dann den div container mit dem iframe immer noch exakt positionieren? (alles ist ja dann relativ, je nach bildschirmbreite...geht das?)

      Danke für deine Hilfe,

      geezer

      1. nur ich bin noch ziemlich neu

        Wenn du neu bist und dich für Webseiten-Gestaltung interessierst bzw. dich ein wenig einarbeiten willst empfehle ich gerade dann selber ein wenig herum zu basteln und nur kleine Teile von WYSIWYG-Editoren zu verwenden, auch wenn es mehr Arbeit macht! ;)

        Meinst du, das ich dann

        1. ein div über das bild positionieren soll und den iframe dann in den  div container rein machen? Das Image Map kann aber dann bleiben, oder?
        2. das bild nicht mehr slicen, sondern als ganzes benutzen (werden die ladungszeiten dann nicht länger dauern)?
        3. mein layout ist ja jetzt zentriert durch das <div align=center> - wenn ich dann ein anderes div drüber mache, kann ich dann den div container mit dem iframe immer noch exakt positionieren? (alles ist ja dann relativ, je nach bildschirmbreite...geht das?)
        1. Was ich meinte war ein DIV-Container mit deiner Grafik als Hintergrundbild (z.B. CSS: background-image:url (./verzeichnis/grafik.jpg)). Deine ImageMap funktioniert in dem Fall nicht mehr, da das Bild ja im Hintergrund verschwindet.

        2. Nein, die Ladezeit wird nur anders aufgeteilt. Die Gesamtdateigröße deiner Bilder verändert sich ja nicht.

        3. Ich denke es würde von der Verschachtelung her in etwa so funktionieren:

        <div align = "center">
           <div style = "width:600px; ... usw.</div>
        </div>

        Das sind nur grobe Lösungsansätze, falls du damit wenig anfangen kannst, gerade weil du noch neu in dem Bereich bist, tut es mir Leid da ich nicht genau weiß wie weit dein Wissen in dem Gebiet reicht. ;)

        MfG,

        McKinsey

        1. Hallo McKinsey,

          <div align = "center">
             <div style = "width:600px; ... usw.</div>
          </div>

          Das sind nur grobe Lösungsansätze

          ... veraltete, auf das Prinzip "Trennung von Gestaltung und Struktur"  pfeifende und mit den Leerzeichen um das "=" invalide noch dazu!

          http://www.w3.org/TR/html401/present/graphics.html#adef-align

          Gruß Gernot