Peter: Images im Browser Fenster darstellen (kein PopUP Fenster)

Frohe Pfingsten!

Ich habe schon des öfteren auf Websites gesehen wenn ich auf die Großansicht des Fotos gehe das anstatt eines PopUP Fensters sich die Großdarstellung des Bildes im Browser darstellt. Der Content wird transparent in der Farbe dunkel grau hintelegt auf dem sich das Foto legt.

Ich suche schon seit 3-4 Stunden im Internet nach fertigen Scripts die das können, finde dazu aber auch nichts :(

Weiß jemand wo ich dazu was finden kann bzw. wie sich die Technik nennt um ansatzweise nähere Informationen dazu zu finden.

Danke!
Gruß Peter

  1. Lieber Peter,

    Du suchst nach der Lightbox, oder meinem jsPopup...

    Liebe Grüße aus Ellwangen,

    Felix Riesterer.

    --
    ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
    1. Hallo Felix

      Ich habe gerade die Beispiele auf deiner Seite jsPopup versucht.
      Dein script wird ausgefürt.
      Wenn ich ein Bild klicke, kommt der Ladevorgang.
      Aber es wird kein Bild geladen.
      Wenn ich wieder hinaus klicke, sehe ich die Seite wieder normal.
      Liegt es nun daran, dass kein Bild geladen werden kann, weil keins gefunden wird,
      oder liegt es daran, dass bei meinem aktivierten FF Java-Script nicht alles erlaubt ist?
      Finde es in diesem Fall nicht barrierefrei.
      Was würde/sollte geschehen, wenn das vergrösserte Bild nicht angezeigt werden kann?

      mfg Beat

      1. Grüße,

        Was würde/sollte geschehen, wenn das vergrösserte Bild nicht angezeigt werden kann?

        wenn es gescheit gemacht ist, wird bei deaktiviertem JS das bild doch in einem neuen oder im gleichen fesnter "konventionell" nagezeigt. das ist aber fast schon mehr eine sache der integration - der verklinkung.

        MFG
        bleicher

        --
        __________________________-
        Menschen an sich , sind nicht schlecht - es sind nur ihre Taten (c).
        http://www.sexgott-or-not.com/?test=428054
        1. Lieber bleicher,

          wenn es gescheit gemacht ist

          wenn Du meine jsPopup-Seite anschaust, dann hast Du dort immer diesen HTML-Code, der mittels JavaScript "umgebogen" wird, und der ohne JavaScript so funktioniert, wie man das auch erwarten würde:
          <a href="vollansicht.jpg"><img src="thumbnail.jpg" alt="..." /></a>

          Liebe Grüße aus Ellwangen,

          Felix Riesterer.

          --
          ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
          1. Grüße,

            <a href="vollansicht.jpg"><img src="thumbnail.jpg" alt="..." /></a>

            genau das meinte ich

            MFG
            bleicher

            --
            __________________________-
            Menschen an sich , sind nicht schlecht - es sind nur ihre Taten (c).
            http://www.sexgott-or-not.com/?test=428054
      2. Lieber Beat,

        Ich habe gerade die Beispiele auf deiner Seite jsPopup versucht.
        [...]
        Aber es wird kein Bild geladen.

        Hmm. Hast Du auch andere Browser ausprobiert? Bei mir in meinem FF arbeitet das Script wie erwartet und daher einwandfrei... Ich kann Deine Beobachtungen nicht nachvollziehen, sorry.

        Finde es in diesem Fall nicht barrierefrei.

        Wenn JavaScript nicht verfügbar ist, dann werden die Bilder direkt aufgerufen. Das ist barrierefrei. Vielleicht ist mein Script nicht perfekt, aber es könnte sein, dass Du einen Werbeblocker in Deinem FF installiert hast, der diesen Mechanismus mit dem "Layer" verhindern will... Das ist dann ein Umstand, auf den kein Script dieser Art irgendwelchen Einfluss hat! Man belehre mich bitte eines Besseren, wenn es eine Möglichkeit gibt, solche Umstände im Script festzustellen!

        Was würde/sollte geschehen, wenn das vergrösserte Bild nicht angezeigt werden kann?

        Das kommt sehr stark auf die Ursache an und natürlich darauf, ob ich per Script diese Ursache überhaupt ermitteln kann. Das jsPopup kann zum Beispiel nicht ermitteln, ob Du einen Werbeblocker-Plugin installiert hast, der das Anzeigen solcher "Layer" (wie z.B. auf vielen funpic-Seiten) verhindert. In diesem Fall hilft nur das komplette Abschalten von JavaScript, um die Bilder in ihren Vollansichten anzeigen zu lassen. Dann sieht das zwar nicht mehr so aus, wie Du das gewollt hast, jedoch sind die Bilder zugänglich (im Sinne von "barrierefrei"). Auch ein Rechtsklick->speichern_unter gelingt immer...

        Liebe Grüße aus Ellwangen,

        Felix Riesterer.

        --
        ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
        1. ... Vielleicht ist mein Script nicht perfekt, aber es könnte sein, dass Du einen Werbeblocker in Deinem FF installiert hast, der diesen Mechanismus mit dem "Layer" verhindern will... Das ist dann ein Umstand, auf den kein Script dieser Art irgendwelchen Einfluss hat! Man belehre mich bitte eines Besseren, wenn es eine Möglichkeit gibt, solche Umstände im Script festzustellen!

          Ich habe jetzt meinen Browser neu gestartet
          Ich habe AddBlock Plus deaktiviert, und deine Seite aufgerufen
          Bilder werden nicht geladen.
          Ich habe keine weitere Massnahme, welche in die Quere kömmen könnte.

          Meine FF Plugins
          AddBlock Plus, HTML Validator, Rechtschreibung
          also nichts, auch keine Bookmarklets, sas mir das erklären könnte.

          Was würde/sollte geschehen, wenn das vergrösserte Bild nicht angezeigt werden kann?

          ... In diesem Fall hilft nur das komplette Abschalten von JavaScript, um die Bilder in ihren Vollansichten anzeigen zu lassen.

          Leider sind das im FF leider mindestens 6 Klicks inklusive Page Reload.

          Ich hatte mal NoScript installiert, aber das war so eine Katastrophe, dass ich es schnell wieder demontiert/deinstalliert habe.
          Irgendwie hoffe ich, dass FF das deaktivieren von JS auch im Buttons Menu mal direkt verfügbar macht.

          Ohne Java-Script funktioniert es, wie vorgesehen.

          mfg Beat

          1. hi,

            Ich hatte mal NoScript installiert, aber das war so eine Katastrophe, dass ich es schnell wieder demontiert/deinstalliert habe.

            Ja, das ding ist wirklich ein schlechter Wurf gewesen, ich hatte es auch nach 3 Stunden deinstalliert.

            Irgendwie hoffe ich, dass FF das deaktivieren von JS auch im Buttons Menu mal direkt verfügbar macht.

            Das gibt es, das und sogar viel mehr.

            https://addons.mozilla.org/de/firefox/addon/60

            grüße

  2. Moin.

    Neben den vorgestellten JavaScript-Lösungen kann man sich sowas übrigens auch nur mit CSS-Selektoren basteln. Womit ich bisher herumgespielt habe:

    1. Links und :active
    hat zur Folge, das Bilder nur während des Klickens auf einen Link angezeigt werden; funktioniert in IE, FF, Opera

    2. Checkboxen mit Label und :checked
    funktioniert in FF, Opera, aber nicht im IE

    3. Links und :target
    die eleganteste Lösung, die ich bisher gefunden habe; funktioniert nur im FF (nicht Opera, IE) - im Safari sollte es theoretisch funktionieren

    Hier mal eine Beispielseite für Version 3.

    Christoph

    1. Hallo,

      1. Links und :active
        hat zur Folge, das Bilder nur während des Klickens auf einen Link angezeigt werden; funktioniert in IE, FF, Opera

      funktioniert aber im IE nicht korrekt, weil der :active fälschlicherweise so interpretiert, wie eigentlich :focus gedacht ist.

      So long,
       Martin

      --
      Ist die Katze gesund,
      freut sich der Hund.
      1. Moin.

        1. Links und :active
          hat zur Folge, das Bilder nur während des Klickens auf einen Link angezeigt werden; funktioniert in IE, FF, Opera

        funktioniert aber im IE nicht korrekt, weil der :active fälschlicherweise so interpretiert, wie eigentlich :focus gedacht ist.

        Danke, dass Du mich darauf hingewiesen hast; ich habe noch etwas weitergebastelt, und tatsächlich eine Lösung gefunden, die in IE und FF wie gewünscht zu funktionieren scheint und sogar wesentlich einfacher gestrickt ist...

        Christoph

        1. Moin.

          Und hier die nächste Iteration, die Dank onclick="return false" auch nicht mehr zum Dokumentanfang springt...

          Christoph

    2. Lieber Christoph,

      Hier mal eine Beispielseite für Version 3.

      mächtig cool!! Können das alle Browser korrekt umsetzen, die die diversen Säure-Tests bestehen? Denn dann könnten wir ja theoretisch darauf warten, bis alle Browser das entsprechend korrekt darstellen...

      Liebe Grüße aus Ellwangen,

      Felix Riesterer.

      --
      ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
    3. Moin.

      Ich war weiter fleißig. Die aktuelle Version funktioniert

      • in FF2.0 ohne Javascript
      • in Opera 9 und IE7 mit Javascript

      Ohne Javascript zeigen IE und Opera die Bilder nur an, während die Maustatse gedrückt ist, der IE6 sollte am position:fixed scheitern. Wie sieht das bei anderen Browsern/Versionen aus?

      Christoph