Recoil19: Dynamische Top-Position für Lightbox2

Hallo zusammen,

ich habe eine Frage im Zusammenhang mit der Lightbox2.

Die Top-Position der Lightbox kann man mittels CSS-Attribut (z.B. "top:10px !important;") definieren.

Nun würde ich Top_position der Lightbox gerne dynamisch gestalten, d.h.

für ein Image Set mit großen Bildern erscheint die Lightbox am oberen Rand der Seite
für ein Image Set mit kleinen Bildern würde ich die Lightbox gerne tiefer setzen, sprich zentrieren

Die CSS-Definitionen der Lightbox sind an sich als Individualformate ('#') definiert.
Kann man derartiges auch emporär ändern (mittels "style")?
Da die Lightbox-Funktionen mittels "rel" referenziert werden ist mir unklar ob eine temporäre Änderung überhaupt möglich ist bzw. falls doch, wie sieht die Syntax dazu aus?

Vielen Dank für eure Hilfe!

  1. Hi,

    Die CSS-Definitionen der Lightbox sind an sich als Individualformate ('#') definiert.
    Kann man derartiges auch emporär ändern (mittels "style")?

    Natürlich.
    Setzen von CSS-Eigenschaft per style-Attribut (bzw. style-Objekt in JavaScript) hat als „Selektor” immer oberste Spezifität.

    Da die Lightbox-Funktionen mittels "rel" referenziert werden ist mir unklar ob eine temporäre Änderung überhaupt möglich ist bzw. falls doch, wie sieht die Syntax dazu aus?

    Du musst dich irgendwo in den Prozess einklinken.

    Bspw. den Links mit rel-Attribut auch noch eine zusätzliche Klasse zu verpassen, auf die beim Initialisieren bzw. Erstellen der LightBox für ein spezielles Element entsprechend reagiert wird, könnte ich mir da ohne nährere Kenntnis des Scriptes als zielführenden Ansatzpunkt vorstellen.

    MfG ChrisB

    --
    “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
    1. Chris,

      danke für die Antwort.

      Die Links sind an sich sehr simpel nach folgendem Muster gestrickt:
      <a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>

      Ich hatte mir auch schon überlegt ein weiteres Argument (zusätzlich zu "title") zu implementieren, aber das geht dann schon ziemlich ins Eingemachte. Und Java-Profi bin ich absolut nicht ;-)

      Bspw. den Links mit rel-Attribut auch noch eine zusätzliche Klasse zu verpassen, auf die beim Initialisieren bzw. Erstellen der LightBox für ein spezielles Element entsprechend reagiert wird, könnte ich mir da ohne nährere Kenntnis des Scriptes als zielführenden Ansatzpunkt vorstellen.

      Wie sollte die Spezifikation einer Klasse zu "lightbox" unter "rel" aussehen?

      Thanx!

      1. Hi,

        Ich hatte mir auch schon überlegt ein weiteres Argument (zusätzlich zu "title") zu implementieren, aber das geht dann schon ziemlich ins Eingemachte. Und Java-Profi bin ich absolut nicht ;-)

        Das macht nichts, denn wir reden hier von JavaScript.

        Ein wenig Beschäftigung mit dieser Materie muss aber sein, wenn du sowas umsetzen willst.

        Wie sollte die Spezifikation einer Klasse zu "lightbox" unter "rel" aussehen?

        Wie meinen?

        MfG ChrisB

        --
        “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
        1. Wie sollte die Spezifikation einer Klasse zu "lightbox" unter "rel" aussehen?

          Wie meinen?

          Ich meinte zu dem angeführten Beispiel des Aufrufs:
          <a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>

          Wie kann man hier noch eine Klasse für 'rel="lightbox"' spezifizieren?
          Mir ist nicht klar wie das syntaktisch aussehen sollte.

          1. Hi,

            Ich meinte zu dem angeführten Beispiel des Aufrufs:
            <a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>

            Wie kann man hier noch eine Klasse für 'rel="lightbox"' spezifizieren?
            Mir ist nicht klar wie das syntaktisch aussehen sollte.

            So, wie bei jedem anderen Element auch.

            MfG ChrisB

            --
            “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]