Franz: SCROLLBAR

Hallo.

Ich möchte eine DIV-Bereich parallel zur Bewegung des Scrollbars auf und ab bewegen.
Kann ich die Scrollbewegung irgendwie auslesen?

MfG

  1. Hallo Franz,

    Ich möchte eine DIV-Bereich parallel zur Bewegung des Scrollbars auf und ab bewegen.
    Kann ich die Scrollbewegung irgendwie auslesen?

    Du meinst, er soll immer an der gleichen Stelle erscheinen, egal, wie stark gescrollt wird?

    Dann brauchst Du kein JavaScript:

    <div style="position: fixed; top: 5px; left: 5px; width: 100px; height: 200px; background: red;">...</div>

    Funktioniert allerdings nicht mit dem Internet Explorer.

    Eine JavaScript-Lösung gibt es hier: http://www.xs4all.nl/~ppk/js/fixedmenu.html

    Im Archiv gibt es auch einen Hack für position: fixed; damit das ganze auch im IE klappt.

    Viele Grüße,
    Christian

    --
    Ich bin ein Bandbreitenverschwender. Meine Signatur tut mir leid. Ehrlich!
  2. Hallo,

    Ich möchte eine DIV-Bereich parallel zur Bewegung des Scrollbars auf und ab bewegen.

    Versuche es erstmal mit position: fixed; Im IE kann man einen Workaround ueber dessen expression()-Feature realisieren:

    div.abc
    {
      color: ...;
      background-color: ...;
      top: ...;
      left: ...;
      height: ...;
      width: ...;
      position: fixed;
      /* fuer IE */
      position: expression("absolute");
      top: expression(document.body.scrollTop - this.offsetHeight + this.offsetHeight);
    }

    MfG, Thomas

    1. Hi,

      position: expression("absolute");
        top: expression(document.body.scrollTop - this.offsetHeight + this.offsetHeight);

      geile Sache!!! Das kannte ich auch noch nicht!!
      Nur seltsam erscheint mir:

      • this.offsetHeight + this.offsetHeight

      wieso kann man das nicht weglassen?
      Ist doch Null!

      Habs ausprobiert: ohne gehts nicht... komisch!!

      Gruß
      Christian

      1. Hallo,

        wieso kann man das nicht weglassen?
        Ist doch Null!

        Habs ausprobiert: ohne gehts nicht... komisch!!

        expression() braucht offenbar einen "Rechen-Anstoß", um aktiv zu werden. Das genannte Beispiel positioniert ueberigens bei top: 0px. Wenn man einen Wert > 0 haben moechte, also etwa top: 150px, dann ist dieses Vorgehen moeglich:

        position: expression("absolute");
        top: expression(parseInt(document.body.scrollTop + 150));

        MfG, Thomas

        1. Aha,

          weißt du auch ab welcher Version das unterstützt wird??

          Christian

    2. Hallo Thomas,

      position: expression("absolute");
        top: expression(document.body.scrollTop - this.offsetHeight + this.offsetHeight);

      Ich lese das hier jetzt zum ersten mal. Alle position:fixed; Hacks, die ich bisher kenne, sind ein ewiger Krampf über CSS-Weichen und ähnliches. Doch so einfach geht das? Hast Du den Hack jetzt selbst "entwickelt" oder hast Du den auch bloß irgendwo her? Weißt Du, ab welcher MSIE-Version der funktioniert?

      Viele Grüße,
      Christian

      --
      Ich bin ein Bandbreitenverschwender. Meine Signatur tut mir leid. Ehrlich!
      1. Hi,

        Ich lese das hier jetzt zum ersten mal. Alle position:fixed; Hacks, die ich bisher kenne, sind ein ewiger Krampf über CSS-Weichen und ähnliches.

        Ich auch!!!
        Schon cool was uns der Thomas hier liefert!

        Weißt Du, ab welcher MSIE-Version der funktioniert?

        Hab gerade mal recherchiert in der MSDN:
        und kam zu folgendem Link:

        < http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/methods/setexpression.asp>

        setExpression ist nur JScript Variante!
        Diese ist verfügbar ab IE 5.0

        expression wird dann auch ab 5.0 verfügbar sein!

        Gruß
        Christian

        1. Hallo Christian,

          expression wird dann auch ab 5.0 verfügbar sein!

          Auf http://msdn.microsoft.com/workshop/author/dhtml/overview/recalc.asp steht sogar was von IE 4.0...

          Viele Grüße,
          Christian

          --
          Ich bin ein Bandbreitenverschwender. Meine Signatur tut mir leid. Ehrlich!
          1. http://msdn.microsoft.com/workshop/author/dhtml/overview/recalc.asp

            ALso ich finde da immer nur was von IE 5!!! Nix mit 4.0!

            Christian

            1. Hallo Christian,

              ALso ich finde da immer nur was von IE 5!!! Nix mit 4.0!

              Hmm. Also ich sehe da 4-5 Mal den Text

              | This feature requires Microsoft® Internet Explorer 4.0 or later. Click the following icon to install the latest version. Then reload this page to view the sample.

              auf der Seite verteilt. Vielleicht kommt der aber nur, weil ich Mozilla verwende.

              Viele Grüße,
              Christian

              --
              Ich bin ein Bandbreitenverschwender. Meine Signatur tut mir leid. Ehrlich!
              1. Hi,

                auf der Seite verteilt. Vielleicht kommt der aber nur, weil ich Mozilla verwende.

                Ja, das ist es! Hab die Seite gerade mal mit Phoenix angesehen. Da kommt das dann auch.

                Aber ich glaube trotzdem das expression() erst ab 5.0 funzt! Weil es da so steht. IE 4 wird wohl nur zum optimalen Betrachten der Seite benötigt...

                Christian

      2. Hallo,

        Ich lese das hier jetzt zum ersten mal. Alle position:fixed; Hacks, die ich bisher kenne, sind ein ewiger Krampf über CSS-Weichen und ähnliches. Doch so einfach geht das? Hast Du den Hack jetzt selbst "entwickelt" oder hast Du den auch bloß irgendwo her?

        Entwickelt habe ich das nicht, nur adaptiert, wobei ich expression() schon ziemlich lange kenne (wird seit IE 5.0 unterstuetzt), siehe z. B.: http://webfx.eae.net/dhtml/cssexpr/cssexpr.html.

        Aufgefallen ist mir die Verwendung kuerzlich bei phpMyAdmin 2.4.0 in der docs.css-Vorlage.

        MfG, Thomas

    3. Hallo Thomas,

      position: expression("absolute");
        top: expression(document.body.scrollTop - this.offsetHeight + this.offsetHeight);

      Vielleicht habe ich missverstanden, worum es geht, aber falls das dieselbe Funktionalität wie position:fixed bieten soll, kann ich nur sagen, dass es sowohl im MSIE 6 als auch 4 nicht zu dem gewünschten Ergebnis führt. Es hat gar keine Wirkung, das heißt, die erste Deklaration wirkt genau wie position:absolute und die zweite genau wie top:0. Beim Scrollen bleibt nichts feststehend...

      Was übersehe ich?

      Grüße,
      Mathias

      1. Hallo,

        Vielleicht habe ich missverstanden, worum es geht, aber falls das dieselbe Funktionalität wie position:fixed bieten soll, kann ich nur sagen, dass es sowohl im MSIE 6 als auch 4 nicht zu dem gewünschten Ergebnis führt. Es hat gar keine Wirkung, das heißt, die erste Deklaration wirkt genau wie position:absolute und die zweite genau wie top:0. Beim Scrollen bleibt nichts feststehend...

        Bei mir bleibt im IE 5.5 und 6.0 der Block beim Scrollen stets oben sichtbar.

        Was passiert bei Dir mit dem bereits genannten Code:

        position: expression("absolute");
        top: expression(parseInt(document.body.scrollTop + 150));

        MfG, Thomas

      2. Hallo,

        position: expression("absolute");
          top: expression(document.body.scrollTop - this.offsetHeight + this.offsetHeight);

        Vielleicht habe ich missverstanden, worum es geht, aber falls das dieselbe Funktionalität wie position:fixed bieten soll, kann ich nur sagen, dass es sowohl im MSIE 6 als auch 4 nicht zu dem gewünschten Ergebnis führt.

        Bei mir ebenfalls nicht.

        Es hat gar keine Wirkung, das heißt, die erste Deklaration wirkt genau wie position:absolute und die zweite genau wie top:0. Beim Scrollen bleibt nichts feststehend...

        Genau das stelle ich hier im IE6SP1 auch fest.

        Gruß,

        MI

        --
        : Michael Jendryschik : michael@jendryschik.de  :  http://jendryschik.de/ :
        : Einführung in XHTML, CSS und Webdesign  :  http://jendryschik.de/wsdev/ :
        : Die Domain  http://best-of-netdigest.de  steht bei sedo.de zum Verkauf. :
        : http://www.sedo.de/search/showdetails.php3?keyword=best-of-netdigest.de :
        1. Hallo,

          Es hat gar keine Wirkung, das heißt, die erste Deklaration wirkt genau wie position:absolute und die zweite genau wie top:0. Beim Scrollen bleibt nichts feststehend...

          Genau das stelle ich hier im IE6SP1 auch fest.

          Dieses Beispiel verhaelt sich im IE wie unter Mozilla und Opera, mal abgesehen vom Flackern beim Scrollen: http://www.styleassistant.de/test/position_fixed_ie.htm.

          MfG, Thomas

          1. Hallo Thomas,

            Dieses Beispiel verhaelt sich im IE wie unter Mozilla und Opera, mal abgesehen vom Flackern beim Scrollen: http://www.styleassistant.de/test/position_fixed_ie.htm.

            Tatsache, das funktioniert. Der Unterschied zu meinem Testdokument ist, dass der DOCTYPE den quirks mode auslöst, die volle Dokumenttyp-Deklaration meines Testdokuments jedoch den standards-compliant mode. Das heißt, dass die Methode im standardkonformen Rendermodus nicht funktioniert. An diese Möglichkeit hatte ich nicht gedacht..

            Ich hatte natürlich darauf geachtet, dass ActiveScripting aktiviert ist.

            Grüße,
            Mathias

            1. Hallo,

              Tatsache, das funktioniert. Der Unterschied zu meinem Testdokument ist, dass der DOCTYPE den quirks mode auslöst, die volle Dokumenttyp-Deklaration meines Testdokuments jedoch den standards-compliant mode. Das heißt, dass die Methode im standardkonformen Rendermodus nicht funktioniert. An diese Möglichkeit hatte ich nicht gedacht..

              Das hatte ich noch gar nicht ueberprueft, aber es funktioniert bei mir unter dieser Voraussetzung auch nicht mehr.

              MfG, Thomas

      3. Hallo,

        Beim Scrollen bleibt nichts feststehend...

        Was übersehe ich?

        Vermutlich ist JavaScript (also Active Scripting) deaktiviert. Wie man den Codezeilen ja schon ansehen kann, werden hier JS-Aufrufe wirksam.

        Eine "Patentloesung" ist das freilich nicht.

        MfG, Thomas

  3. Hallo.

    Ich möchte eine DIV-Bereich parallel zur Bewegung des Scrollbars auf und ab bewegen.
    Kann ich die Scrollbewegung irgendwie auslesen?

    MfG

    Das ist mit JavaScript möglich.
    http://selfhtml.teamone.de/javascript/objekte/window.htm#page_y_offset

    Bitte beachte die unterschiedliche Syntax von IE und Netscape. Opera (6.05) verwendet ebenfals die IE Syntax.

    Um Herauszufinden, welcher Browser vorliegt kannst du die dhtml-Bibliothek verwenden:
    http://selfhtml.teamone.de/dhtml/beispiele/dhtml_bibliothek.htm

    Ich hoffe, das war die Antwort auf deine Frage.

    MGF
     Christian