audio123: Problem mit Ankern in Opera ...

Hallo !

Ich habe da ein Problem mit Ankern.
Ich will am Ende der Seite einen Link haben, der den Besucher wieder nach oben bringt, also den berühmtem "#top"-Link.
Das hab ich auch soweit hinbekommen und funktioniert auch in allen Browsern bis auf Opera.
Opera springt -nicht- bis ganz oben auf die Seite, sondern nur soweit, dass genau meine Navigation abgeschnitten wird, das ist natürlich nicht sehr sinnvoll, ich weiß aber nicht an was es liegt.
Ich habe auch auf manchen Unterseiten noch andere Anker-Links, auch diese interpretiert Opera falsch, alle anderen Browser dagegen haben keine Probleme damit. Bin echt ratlos.

schaut euch das hier mal an: http://www.audio123.de/download/software/software.html
da ist ganz unten ein #top-Link, der funktiuoniert in Opera nicht, obwohl ich ganz oben in der Sete auch ein <a name="top"> drinnenhabe, der link geht auf #top müsste doch eigentlich gehen ?

Weiß jemand warum das in Opera nicht korrekt funktioniert ?

Vielen Dank schonmal,
audio123

  1. Hi,

    ich habe auf eigenen Seiten <a href="#top">-Links, und oben kein <a name="top"> oder vergleichbares eingebaut, und es funktioniert wunderbar. Mach doch mal dein <a name...-teil weg und schau mal...

    Wauwau

    --
    Wau - hier ist mein Selfcode:
    ss:) zu:) ls:< fo:~ de:] va:) ch:° n4:# rl:( br:< js:| ie:% fl:| mo:|
    [mein alter sah optisch irgendwie besser aus ;-)]
    1. ich habe auf eigenen Seiten <a href="#top">-Links, und oben kein <a name="top"> oder vergleichbares eingebaut, und es funktioniert wunderbar. Mach doch mal dein <a name...-teil weg und schau mal...

      wenn ich das <a name="top"></a> ganz rausmache, dann geht es auch in allen Browsern, bis auf Opera, da tut sich dann -gar nichts- mehr beim klicken auf den Link ...

    2. Hallo,

      <body id="top">
      <a name="top"></a>
      ...
      ...
      ...
      <a href="#top">nach oben</a>

      ich glaube bei ankern innerhalb des dokuments kann es probleme mit padding-angaben geben. (</archiv>)

      mfg NAG

      --
      signatur
      1. <body id="top">
        <a name="top"></a>
        ...
        <a href="#top">nach oben</a>

        ich glaube bei ankern innerhalb des dokuments kann es probleme mit padding-angaben geben. (</archiv>)

        hey mit dem <body id="top" ...> geht es.
        dann funktioniert jetzt aber nur der top-link, die anderen anker-links gehen in opera weiterhin nicht ...

        1. Hallo,

          dann funktioniert jetzt aber nur der top-link, die anderen anker-links gehen in opera weiterhin nicht ...

          <a href="#mitte">nach unten zur dokumentmitte</a>
          ...
          ...
          ...
          <a name="mitte" id="mitte"></a>

          (so sollte es auch für top funktionieren - id="top" muß nicht im body stehen)

          mfg NAG

          --
          signatur
          1. <a href="#mitte">nach unten zur dokumentmitte</a>
            ...
            <a name="mitte" id="mitte"></a>

            (so sollte es auch für top funktionieren - id="top" muß nicht im body stehen)

            achso war das gemeint, jetzt hab ich es verstanden, muss nicht nur name, sondern zusätzlich noch id angeben.

            danke für die hilfe, :-)

          2. <a href="#mitte">nach unten zur dokumentmitte</a>
            ...
            <a name="mitte" id="mitte"></a>

            (so sollte es auch für top funktionieren - id="top" muß nicht im body stehen)

            jetzt hab ich nochmal rumprobiert, das id="top" muss doch im body stehen, sonst klappt es in opera nicht :-(

  2. Hallo

    Weiß jemand warum das in Opera nicht korrekt funktioniert ?

    Dein Hauptproblem ist der Iframe. Opera zeigt diesen nicht in der Tabelle sondern am oberen Rand des Dokumentes an. Damit befindet sich der Anker für ihn am Beginn des eigentlichen Dokumentes (unterhalb der Navigation). Dorthin springt er auch.
    Ja, ja Probleme mit Frames.
    Wie soll ich überhaupt navigieren, wenn mein Browser keine Iframes unterstützt oder diese abgeschaltet sind?
    Binde die Navigation lieber direkt, oder mittels Includes ein.

    MFG
    Detlef

    --
    - Wissen ist gut
    - Können ist besser
    - aber das Beste und Interessanteste ist der Weg dahin!
    1. Dein Hauptproblem ist der Iframe. Opera zeigt diesen nicht in der Tabelle sondern am oberen Rand des Dokumentes an. Damit befindet sich der Anker für ihn am Beginn des eigentlichen Dokumentes (unterhalb der Navigation). Dorthin springt er auch.

      mittlerweile funktioniert es, das <a name=top" war an der falschen stelle, stimmt ...

      Ja, ja Probleme mit Frames.
      Wie soll ich überhaupt navigieren, wenn mein Browser keine Iframes unterstützt oder diese abgeschaltet sind?
      Binde die Navigation lieber direkt, oder mittels Includes ein.

      ein browser der keine iframes unterstützt ist kein html-konformer browser, iframes gehören zum html-standard.

      1. Hallo

        ein browser der keine iframes unterstützt ist kein html-konformer browser, iframes gehören zum html-standard.

        Erst ab Netscape 6 werden Iframes unterstützt (da soll es durchaus noch 4er geben), welche anderen Browser damit eventuell auch nicht klarkommen kann ich nicht sagen.
        Außerdem sind Iframes nur in Transitional erlaubt, werden also voraussichtlich irgendwann einmal herausfliegen.

        Meine Meinung dazu ist lediglich:
        Ist es wirklich nötig extra Iframes zu verwenden, um ein Menü einzubinden?
        Sollte nicht wenigstens eine alternative Navigation angeboten werden?

        PS: Die Lösung mit den verschiedenen Menüs, von denen nur jeweils eines sichtbar ist und mittels Ankersprung das richtige sichtbar wird, ist interessant.

        MFG
        Detlef

        --
        - Wissen ist gut
        - Können ist besser
        - aber das Beste und Interessanteste ist der Weg dahin!
        1. Erst ab Netscape 6 werden Iframes unterstützt (da soll es durchaus noch 4er geben), welche anderen Browser damit eventuell auch nicht klarkommen kann ich nicht sagen.
          Außerdem sind Iframes nur in Transitional erlaubt, werden also voraussichtlich irgendwann einmal herausfliegen.

          mag sein ja ... aber da das mal ironisch gesagt sicher nicht gleich nächste woche sein wird, kann man iframes denke ich doch einsetzten, eine website bleibt doch eh nicht immer so wie sie ist, irgendwann schmeiss ich mal das ganze konzept weg und fange neu an, zurzeoit ging es mir aber nur darum, von der frameset-konstruktion wegzukommen, wegen der bekannten probleme mit suchmaschinen und was noch alles damit verbunden ist (kein direktes verlinken möglich und wnen ja, dann nur per js-nachlade-funktion un sowas).

          Meine Meinung dazu ist lediglich:
          Ist es wirklich nötig extra Iframes zu verwenden, um ein Menü einzubinden?
          Sollte nicht wenigstens eine alternative Navigation angeboten werden?

          bin ja gerade am umgestalten der seite (war früher mal ein frameset *uah*) ... es kommt auch noch eine site-map, damit also sozusagen auch eine alternative navigation.

          PS: Die Lösung mit den verschiedenen Menüs, von denen nur jeweils eines sichtbar ist und mittels Ankersprung das richtige sichtbar wird, ist interessant.

          das hat sich daraus ergeben, dass eben beim auswählen eines hauptmenüpunktes nicht die ganze seite neu geladen werden sollte, sondern jeweils nur der effekt entsteht, dass sich das untermenü lädt und sonst nichts ... :-)

      2. Hallo,

        ein browser der keine iframes unterstützt ist kein html-konformer browser, iframes gehören zum html-standard.

        Das hat mit HTML-Konformität nichts zu tun. Ein Browser kann voll HTML 4-konform sein und trotzdem iframes nicht als solche umsetzen und stattdessen den Alternativinhalt anzeigen. Das gilt ebenso für die Elemente object, img, applet usw. Es ist ferner nicht notwendig, eine Seite zu schreiben, die HTML 4-Kompatibilität voraussetzt, da HTML 4 in diesem Punkt problemlos abwärtskompatibel ist. Beides setzt natürlich voraus, dass du Alternativinhalte im iframe-Element angibst, also <iframe>...Alternativnavigation...</iframe>.

        Mathias

    2. Hallo,

      Weiß jemand warum das in Opera nicht korrekt funktioniert ?

      Dein Hauptproblem ist der Iframe. Opera zeigt diesen nicht in der Tabelle sondern am oberen Rand des Dokumentes an.

      Wie kommst du zu dieser Aussage? Der Iframe befindet sich (mit position:static und margin:0) in der ersten Tabellenzelle. Die Tabelle grenzt direkt an den oberen Dokumentrand. Bei border="1" für die Tabelle und bspw. border:1px solid red für den iframe zeigt sich diese Verschachtelung. Indem Opera dies umsetzt, verhält er sich wie die anderen Browser.

      Operas Verhalten lässt sich mit folgendem Code reproduzieren (das Schema gleicht dem ursprünglichen Code):

      <table border="0" cellspacing="0" cellpadding="0" width="400">
      <tr>
      <td style="border:1px solid black;"><a name="top"></a><iframe name="navi" style="height:100px; width:100%; border:1px solid red;" border="0" frameborder="0" src="about:blank" scrolling="no"></iframe></td>
      </tr>
      </table>
      <p>bla</p>
      <p>bla</p>
      ...Viele Absätze...
      <p><a href="#top">nach oben</a></p>

      Damit befindet sich der Anker für ihn am Beginn des eigentlichen Dokumentes

      Das »eigentliche« Dokument beginnt mit dem Start-Tag des äußeren table-Elements.

      (unterhalb der Navigation).

      Die Navigation befindet sich im durch das iframe eingebundenen Dokument, dieses kommt in der besagten Tabellenzelle *nach* dem fraglichen a-Element. Wie gesagt wurde der iframe nicht durch position oder margin verschoben bzw. aus dem Fluss genommen.

      Dorthin springt er auch.

      Er springt eben nicht *unter* das iframe, sondern nimmt ein Stück vom iframe noch mit. Das ist erklärbar, weil der Anker horizontal links daneben liegt, siehe mein anderes Posting.

      Mathias

      1. Hallo Mathias

        Wie kommst du zu dieser Aussage?...

        <img src="http://www.selk-guben.de/demo/audio123.gif" border="0" alt="">

        MFG
        Detlef

        --
        - Wissen ist gut
        - Können ist besser
        - aber das Beste und Interessanteste ist der Weg dahin!
        1. Hallo Detlef, bin jetzt ein wenig erschrocken als ich den screenshot gesehen habe ...
          ist der von vorher oder hast du den gerade eben erstellt, ich meine, besteht das problem also immernoch auf meiner seite ?? :-/

          1. Hallo

            Bin jetzt erst wieder online.

            ist der von vorher oder hast du den gerade eben erstellt, ich meine, besteht das problem also immernoch auf meiner seite ?? :-/

            Der Screenshot ist von 17:10, es sieht auch jetzt noch genauso aus.
            Allerdings funktioniert der top-Link jetzt.

            MFG
            Detlef

            --
            - Wissen ist gut
            - Können ist besser
            - aber das Beste und Interessanteste ist der Weg dahin!
            1. ist der von vorher oder hast du den gerade eben erstellt, ich meine, besteht das problem also immernoch auf meiner seite ?? :-/

              Der Screenshot ist von 17:10, es sieht auch jetzt noch genauso aus.

              könntest du jetzt bitte nochmal nachgucken ob der fehler immer noch besteht ? habe jetzt den anker -vor- die tabelle, genauso wie ich es mit dem top-link zuvor gemahct hatte, müsste jetzt eigentlich gehen ...
              habe hier nur opera >7, daher kann ich es nicht testen mit älteren versionen ...

              1. Hallo

                könntest du jetzt bitte nochmal nachgucken ob der fehler immer noch besteht ?

                Also im Opera sieht es genauso aus wie vorher aber im IE so:

                <img src="http://www.selk-guben.de/demo/audio123_IE.gif" border="0" alt="">

                MFG
                Detlef

                --
                - Wissen ist gut
                - Können ist besser
                - aber das Beste und Interessanteste ist der Weg dahin!
                1. <img src="http://www.selk-guben.de/demo/audio123_IE.gif" border="0" alt="">

                  oh gott fällt mir jetzt nur ein so wie das ausguckt ...
                  an was zum teufel liegt das nur ...
                  bei mir läuft es in allen browser (ie 6.0, mozilla 1.6, netscape 7.1, opera 7.23 und mozilla firebird 0.7) gleich und so wie es eigentlich ausgucken soll.
                  verstehe das leider ned mehr, werd ich mich morgen nochmal dransetzen müssen, ...
                  welche version vom ie hast du ?

                  1. Hallo

                    welche version vom ie hast du ?

                    6.02800.1106 läuft unter W98

                    MFG
                    Detlef

                    --
                    - Wissen ist gut
                    - Können ist besser
                    - aber das Beste und Interessanteste ist der Weg dahin!
                    1. welche version vom ie hast du ?

                      6.02800.1106 läuft unter W98

                      naja ehct äusserst seltsam.
                      muss das dann vielleicht doch anders lösen ...

                      obwohl ich es echt nicht verstehe. hatte die seite letzte woche auch als ich in der schule war getestet, da haben wir ie 5 installiert und netscapr 7.1, da hats auch funktioniert, dann auf dem pc bei meinem dad auch, der hat auch nen alten ie drauf ...

                      1. Hallo audio123

                        Die Anzeige im IE ist wieder in Ordnung, beim Opera ist das Menü immer noch am oberen Rand, teilweise außerhalb des Rahmens.

                        MFG
                        Detlef

                        --
                        - Wissen ist gut
                        - Können ist besser
                        - aber das Beste und Interessanteste ist der Weg dahin!
        2. Hallo,

          Wie kommst du zu dieser Aussage?...

          <img src="http://www.selk-guben.de/demo/audio123.gif" border="0" alt="">

          Kann es sein, dass wir von zwei verschiedenen Problemen reden und du dich auf das Dokument im iframe beziehst (also hier http://www.audio123.de/navi/navi.html#downloads)? Der von audio123 genannte Fehler tritt nur in Opera 7 auf, das Problem mit dem falschen Anspringen des Ankers im iframe, sodass die jeweilige Navigation nicht auf der Höhe des Hintergrundbilds liegt, nur in Opera <7.

          Was dieses Problem angeht, so würde ich es so lösen (und dabei gleich das Dokument aufräumen, sodass der Code kürzer wird): http://molily.de/temp/audio123-navigation.html

          Mathias

          1. Hallo Mathias

            ...Der von audio123 genannte Fehler tritt nur in Opera 7 auf...

            Das Problem trat auch in meinem Opera 6.04 auf.

            Ich hatte, nachdem ich mir das Verhalten des top-Links angesehen hatte, kurz in den Quelltext gesehen, und als erstes auch deine Problemlösung [pref:t=73305&m=422238] angenommen, mir die Seite gezogen und den Anker an den Dokumentenanfang gesetzt. Als ich das dann mit dem Opera testete, funktionierte der Sprung zum Anker immer noch nicht richtig, gleichzeitig fiel mir die aus der Tabelle verschobene Navigation auf.
            Das bewog mich dann dazu [pref:t=73305&m=422181] zu posten, ohne meine Quelltextversion nocheinmal zu kontrollieren.
            Wie ich jetzt feststellte, hatte ich beim verschieben des Ankers einen Fehler gemacht.

            MFG
            Detlef

            --
            - Wissen ist gut
            - Können ist besser
            - aber das Beste und Interessanteste ist der Weg dahin!
          2. Kann es sein, dass wir von zwei verschiedenen Problemen reden und du dich auf das Dokument im iframe beziehst (also hier http://www.audio123.de/navi/navi.html#downloads)? Der von audio123 genannte Fehler tritt nur in Opera 7 auf, das Problem mit dem falschen Anspringen des Ankers im iframe, sodass die jeweilige Navigation nicht auf der Höhe des Hintergrundbilds liegt, nur in Opera <7.

            ich hab auch hier noch ein wenig rumprobiert und nun genauso wie zuvor mit dem top-link den anker -vor- die tabelle, es müsste also jetzt auch hier funktionieren in opera v<7, rein theoretisch ...

            Was dieses Problem angeht, so würde ich es so lösen (und dabei gleich das Dokument aufräumen, sodass der Code kürzer wird): http://molily.de/temp/audio123-navigation.html

            danke auch für das, dass du dir solche mühe machst, ich werd mir das auch noch genauer angucken und einiges übernehmen dann :-)

            danke
            audio123
            :-)

  3. Hallo,

    schaut euch das hier mal an: http://www.audio123.de/download/software/software.html
    da ist ganz unten ein #top-Link, der funktiuoniert in Opera nicht, obwohl ich ganz oben in der Sete auch ein <a name="top"> drinnenhabe, der link geht auf #top müsste doch eigentlich gehen ?

    Weiß jemand warum das in Opera nicht korrekt funktioniert ?

    Weil das leere a-Inline-Element in der Zeile mit dem iframe (replaced) bei bei vertical-align:baseline vertikal unten ausgerichtet ist, weil das iframe die Zeile auf 140px Höhe vergrößert:

    /---------------------------\ |   /---------------------\ | <---- Oberkante der Zeilenbox
    |   |                     | |
    |   |                     | |
    |   |                     | |
    |   |                     | |
    |   |                     | |
    | _ |                     | | <---- Operas Sprunghöhe
    ||_|---------------------/ |
    ---------------------------/

    Die äußere Box ist die Tabellenzelle, die innere große Box der iframe, daneben links das a-Element, welches aber eine Breite 0 hat und demnach nicht wie im Schema sichtbar ist. Sobald es Inhalt bekommt, liegt es auch nicht mehr dort, sondern in einer Zeilenbox über dem iframe, weil der iframe mit width:100% so breit ist wie die Zelle und daher kein Text neben sich duldet.

    Ohne vertical-align-Angabe wird der iframe genauso wie img, object und input standardmäßig auf der Basislinie ausgerichtet. Opera springt nun nicht den oberen Rand der Zeilenbox der zugehörigen anonymen Inline-Box an (diese geht bei vertical-align:baseline von der Oberkante des iframes bis zur Unterkante der a-Inline-Box), sondern den des a-Elements.
    Abhilfe wäre freilich vertical-align:top für das jeweilige replaced Inline-Element.

    Zur Verdeutlichung:

    <table border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td style="border:1px solid red;"><a name="top" style="background-color:red;">y</a><iframe src="leer.html" style="border:1px solid red;" frameborder="0" scrolling="no"></iframe></td>
    </tr>
    </table>

    Verallgemeinert:

    <div style="border:1px solid red; font-family:sans-serif">
    <span style="background-color:yellow">µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê</span><br>
    <span style="background-color:teal">µ Ê <a name="top" style="background-color:silver">µ Ê</a> µ Ê<img src="empty.gif" width="200" height="100" alt="">µ Ê</span><br>
    <span style="background-color:yellow">µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê µ Ê</span>
    </div>

    Jeweils mit und ohne vertical-align:top für den iframe/das Bild.

    MSIE macht es falsch, indem er alle Inline-Boxen auf die Zeilenboxhöhe anpasst, das stört aber nicht. Opera 7.23 setzt vertical-align:bottom falsch um, Opera 7.5p2 setzt vertical-align:top nicht um, dafür aber vertical-align:text-top.

    Warum aber überhaupt so umständlich? Ein leeres a-Element am Dokumentanfang direkt nach dem body-Tag sollte keine Zeilenbox erzeugen und in Transitional wäre es valide. Noch einfacher natürlich die id für body.

    Mathias

    1. wow danke für die ausführliche antwort :-)

      hab aber vorher schon geschrieben dass es jetzt funktioniert.
      habe einfach das <a name="top"></a> gleich nach dem <body> hin, bevor die ganzen tabellen anfangen, jetzt springt auch opera korrekt bis nach ganz oben.

      trotzdem vielen dank :-)
      audio123