Ein altes Script zum Funktionieren bringen?


Status
Dieses Thema wurde gelöst! Zur Lösung gehen…

Webhufi

Mitglied
Ich habe alle Einträge auskommentiert und dann einzeln wieder aktiviert; so konnte ich alle Fehler finden. Ich lerne immer wieder dazu, dank deiner Hilfe.
Jetzt kann ich mit der Scannerei weiter machen.

Den Text im geöffneten Bild habe ich gelöscht, nur den Hinweis "close window" kriege ich nicht weg. Er ist unnötig, aber ich finde den entsprechenden Eintrag nicht. Dafür habe ich den grauen HG durch das HG-Bild im Album ersetzt (ist homogener); immerhin habe ich das gefunden ;-)

Umlaute sind auch wieder da!

Es gibt im Album zwei Wahlmöglichkeiten: zeige Bilder in diesem Fenster und zeige Bilder in einem neuen Fenster. Es wird aber immer ein neues Fenster geöffnet. Was passiert im ersten Fall? Ich würde das vielleicht für sinnvoller halten; kannst du mir das mal zeigen?

Schau hier die neue Testseite, wenn du möchtest

BTW: Stimmt! Zwischen den Röhren der über zwei Meter hohen Rechner, die immerhin die Grundrechenarten beherrschten, sind Viecher rumgekrochen (meistens Wanzen und Käfer = bug) und haben manchmal die Elektronik lahmgelegt... :) Heutzutage kommt da sicher nicht das kleinste Viech mehr rein... ;-)
 

Sempervivum

Erfahrenes Mitglied
Es gibt im Album zwei Wahlmöglichkeiten: zeige Bilder in diesem Fenster und zeige Bilder in einem neuen Fenster. Es wird aber immer ein neues Fenster geöffnet.
Das ist mir auch schon aufgefallen. Ich werde es mir mal ansehen. Wenn Du es für sinnvoller hältst, das Bild im selben Fenster zu öffnen, könnte die Auswahl entfallen und man würde Platz gewinnen.

nur den Hinweis "close window" kriege ich nicht weg. Er ist unnötig, aber ich finde den entsprechenden Eintrag nicht.
Das ist einfach, Du brauchst nur die eine Zeile zu löschen, die ich hier mit Pfeil markiert habe:
Code:
        // Auch das HTML für das Bild im Body eintragen
        var thehtml = '<figure><div id="bgimg" style="background:url(parchment.jpg)"><img src="' + picName + '"></div>'
            //+ '<figcaption>' + ActiveArray[current].TxtVal + '</figcaption>
            + </figure>' // <-- dieses muss erhalten bleiben
            + '<a href="javascript:window.close();">close window</a>'; // <-- diese Zeile loeschen
        bodyWin.innerHTML = thehtml;

    }, 100);
}
Außerdem ist mir aufgefallen, dass das HTML fehlerhaft ist: Das schließende </figure> muss erhalten bleiben.
 

Sempervivum

Erfahrenes Mitglied
Es gibt im Album zwei Wahlmöglichkeiten: zeige Bilder in diesem Fenster und zeige Bilder in einem neuen Fenster. Es wird aber immer ein neues Fenster geöffnet.
Die Ursache habe ich jetzt gefunden: Bei Klick auf das Bild links im Notizblock ist die Auswahl nicht wirksam, weil dieses Bild in einem a-href-Tag liegt, das sofort das Bild im neuen Fenster öffnet, ohne die Radiobuttons abzufragen. Man könnte dies ohne Probleme ändern und die Auswahl dort abfragen, aber Du schriebst ja oben, dass Du eine Auswahl nicht für sinnvoll hältst. Verstehe ich das richtig, dass Du meinst, wir sollten auf das neue Fenster verzichten und das große Bild im selben Fenster anzeigen?
 

Webhufi

Mitglied
Wenn ich das + </figure>' wieder einfüge, funktioniert nichts mehr.

close window rausgenommen, es steht aber immer noch im Fenster.

Zum Fenster:

Ich habe den Body nach links gestellt, wegen der (vielleicht) besseren Anzeige im Smartphone; da ich keines habe, kann ich das nur in der Vorschau meines CMS sehen (Foto). Möglicherweise ist das aber auch egal.

Die Page habe ich als iFrame in mein CMS integriert, s. neuer Link
Responsive ist sie auch, bis halt auf die großen Bilder.

Was passiert, wenn wir die großen Bilder im gleichen Fenster öffnen? Dann müssten sie ja im Smartphone auch zu sehen sein? Vielleicht sogar responsive?

Die Fensterabfrage können wir getrost weglassen.
 

Anhänge

Sempervivum

Erfahrenes Mitglied
Was passiert, wenn wir die großen Bilder im gleichen Fenster öffnen? Dann müssten sie ja im Smartphone auch zu sehen sein? Vielleicht sogar responsive?
In meinem Smartphone (Samsung A50, Android) sind sie auch bei der jetzigen Version zu sehen, d. h. mit neuem Fenster und lassen sich auch einigermaßen in das Browserfenster einpassen. Einigermaßen schließt ein: "nicht präzise", aber ganz akzeptabel. Das größere Problem auf dem Smartphone ist die Hauptseite, denn im Hochformat passt die nicht hinein und man muss ständig scrollen. Wenn man es vernünftig machen wollte, müsste man die Darstellung umschalten und die linke und rechte Seite des Notzibuches im Hochformat untereinander darstellen.
 

Webhufi

Mitglied
Hm, ich denke, dann können wir das so lassen. Ich sehe ja ständig Leute, die ihr Gerät seitlich drehen; das müsste dann genügen, denke ich. Dann könnten wir ja einfach eine der beiden Auswahlen weglassen, oder? Im Querformat passt auch das Album perfekt rein.

Ach ja: Wenn du das Fenster noch einen Tick verkleinerst, so dass es nur ganz knapp um die Bilder herum liegt?
 

Webhufi

Mitglied
Noch etwas: Die Auswahlmöglichkeit habe ich entfernt. Ich überlasse es deiner Erfahrung, ob die großen Bilder sich dann in einem neuen oder im gleichen Fenster öffnen. Ich kann es leider nicht ausprobieren, wie das aussehen wird.
 

Sempervivum

Erfahrenes Mitglied
ich denke, dann können wir das so lassen. Ich sehe ja ständig Leute, die ihr Gerät seitlich drehen; das müsste dann genügen, denke ich.
Ich konnte es trotzdem nicht lassen, es zu implementieren. Sieht dann auf meinem Handy so aus:
Screenshot_20200201-214033_Samsung Internet.jpg
Wenn es dir nicht gefällt, können wir es leicht im CSS wieder deaktivieren.

Wenn du das Fenster noch einen Tick verkleinerst, so dass es nur ganz knapp um die Bilder herum liegt?
Das ist das, was ich oben meinte:
lassen sich auch einigermaßen in das Browserfenster einpassen. Einigermaßen schließt ein: "nicht präzise", aber ganz akzeptabel.
Die Berechnungen haben sich bei einem neuen Fenster etwas schwierig gestaltet. Leichter wäre es, wenn wir eine Lightbox verwenden würden, das würde dann so aussehen:
hufnagel-lightbox.png
Man könnte auch noch einen weißen Rand drum herum machen.
 

Sempervivum

Erfahrenes Mitglied
PS: Wie Du auf dem ersten Screenshot siehst, verbirgt der Samsung-Browser die Optionen des Select und zeigt sie erst, wenn man drauf tippt. Möglicher Weise müsste wir da auch noch etwas tun, damit sie immer sichtbar sind.
 

Webhufi

Mitglied
Es scheint so, als würde dir das Projekt Spaß machen... Freut mich ganz arg!

In der Hochkantversion geht dann allerdings das Flair des Albums verloren.
Ich denke, dass es einem User zuzutrauen ist, dass er sein Gerät quer stellt, das sollte allgemein üblich sein. Deine Überlegungen sind denoch klasse.

Eine Lightbox? Das sieht richtig gut aus auf dem Screenshot! Wichtig für das Handling ist halt, dass die Page auf allen Endgeräten gut erkennbar ist.

Sicher: Es ist keine wichtige Seite, aber mein Herz hängt daran.

Mach bitte erstmal eine Wochenendpause und schick mir dann deine Vorschläge in Form der geänderten .js Dateien.

Einen Dank an dich habe ich übrigens schon in meinem Text der Seite untergebracht!
 

Sempervivum

Erfahrenes Mitglied
Hier ist jetzt der Code. Das HTML habe ich mal unverändert gelassen und nur das hinzu gefügt, was für die Lightbox nötig ist. Ich würde aber empfehlen, es ein wenig auf den neuesten Stand zu bringen, d. h. das Tabellenlayout durch Flexlayout zu ersetzen und auch das CSS aufzulagern. Das Layout, was für den Besucher sichtbar ist, kann dabei unverändert bleiben. Das Javascript mit der Konfiguration sollte unverändert bleiben können.
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>

    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <title>meine Zeichnungen</title>


    <link rel="stylesheet" type="text/css">
    <style>
        /* Lightbox */
        #lightbox {
            /* display: none; */
            position: absolute;
            border: 6px ridge darkgrey;
            background-image: url(parchment.jpg);
            display: flex;
            align-items: center;
            justify-content: center;
            transform: scale(0);
            transition: 0.5s;
        }

        #lightbox-ovl {
            display: block;
            position: absolute;
            background-color: rgba(0, 0, 0, 0.7);
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            transform: scale(0);
            transition: 0.5s;
        }
    </style>

    <script language="JavaScript" src="photoalbum-config-4.js"></script>
    <script language="JavaScript" src="photoalbum-code-tablayout-lightbox.js"></script>
</head>


<body style="">

    <center>
        <br>

        <form name="SuzyForm">
            <table border="0">

                <tbody>

                    <tr>

                        <td>
                            <table style="margin: 0px; padding: 0px;" border="0" cellspacing="0">

                                <tbody>

                                    <tr align="center">

                                        <td style="border-top: 2px groove rgb(136, 136, 136); border-left: 4px groove rgb(136, 136, 136); border-bottom: 4px groove rgb(136, 136, 136); margin: 0px; padding: 10px; background: transparent url(parchment.jpg) repeat scroll 0% 50%; -moz-background-clip: initial; -moz-background-origin: initial; -moz-background-inline-policy: initial; width: 275px;"
                                            bgcolor="#f9f9f9">
                                            <div id="SuzySpot">
                                                <script language="javascript">
                                                    document.write('<a href=javascript:SuzyPicRemote("' + ActiveArray[current].PicVal + '");><img name="PicShowing" src=' + ActiveArray[current].PicVal + ' height=200 border=0></a>');
                                                </script>
                                            </div>

                                        </td>

                                        <td style="border-top: 2px groove rgb(136, 136, 136); border-bottom: 4px groove rgb(136, 136, 136); background: transparent url(parchmentring.jpg) repeat scroll 0% 50%; -moz-background-clip: initial; -moz-background-origin: initial; -moz-background-inline-policy: initial; width: 36px;"
                                            border="0">&nbsp;</td>

                                        <td style="border-top: 2px groove rgb(136, 136, 136); border-right: 4px groove rgb(136, 136, 136); border-bottom: 4px groove rgb(136, 136, 136); padding: 5px 20px 5px 5px; background: transparent url(parchment.jpg) repeat scroll 0% 50%; -moz-background-clip: initial; -moz-background-origin: initial; -moz-background-inline-policy: initial; width: 225px; font-family: verdana; font-style: normal; font-variant: normal; font-weight: normal; font-size: 8pt; line-height: normal; font-size-adjust: none; font-stretch: normal; color: rgb(0, 0, 68); margin-left: 0px;"
                                            valign="top">
                                            <div id="journal">
                                                <script language="javascript">
                                                    document.write('<br>' + ActiveArray[current].TitVal + '</b><p>' + ActiveArray[current].DatVal + '<p style="text-align:center; text-indent:25px">' + ActiveArray[current].TxtVal);
                                                </script>
                                            </div>

                                        </td>

                                    </tr>

                                </tbody>
                            </table>

                            <p> </p>

                            <center>
                                <table style="border: 2px ridge rgb(255, 255, 255);">

                                    <tbody>

                                        <tr align="center">

                                            <td rowspan="4">
                                                <div id="PicSpot">
                                                    <select size="13"
                                                        style="width: 200px; font-family: verdana; font-style: normal; font-variant: normal; font-weight: normal; font-size: 8pt; line-height: normal; font-size-adjust: none; font-stretch: normal;"
                                                        name="SuzyDropdown"
                                                        onchange="ShowSuzyPic(SuzyForm.SuzyDropdown.options.selectedIndex);">
                                                        <script language="javascript">LoadPiclist();</script>
                                                    </select>

                                                </div>

                                            </td>

                                            <td style="border-bottom: 2px solid rgb(204, 204, 204);"> <input value="<<"
                                                    onclick="PreviousSuzyPic();"
                                                    style="font-family: verdana,helvetica,arial; font-style: normal; font-variant: normal; font-weight: normal; font-size: 8pt; line-height: normal; font-size-adjust: none; font-stretch: normal; text-align: center;"
                                                    type="button">&nbsp; <input value=">>" onclick="NextSuzyPic();"
                                                    style="font-family: verdana,helvetica,arial; font-style: normal; font-variant: normal; font-weight: normal; font-size: 8pt; line-height: normal; font-size-adjust: none; font-stretch: normal; text-align: center;"
                                                    type="button"><br>

                                                voriges &nbsp; - &nbsp; n&auml;chstes<br>

                                            </td>

                                        </tr>

                                        <tr>

                                            <td style="border-bottom: 1px solid rgb(204, 204, 204);"><input
                                                    name="SelectedMode" value="chkSlideshow" onclick="NextSuzyPic();"
                                                    type="radio">- Diashow!
                                                &nbsp; &nbsp; <input name="SelectedMode" value="chkAlbum"
                                                    onclick="ShowSuzyPic(current);" checked="checked" type="radio">-
                                                Fotoalbum! <br>

                                                <center>Anzeigedauer: <input name="Timer" size="3" value="5"
                                                        type="text"> Sekunden</center>

                                            </td>

                                        </tr>

                                        <tr>

                                            <td>
                                                <p> </p>

                                            </td>

                                        </tr>

                                    </tbody>
                                </table>

                            </center>

                        </td>

                    </tr>

                </tbody>
            </table>

        </form>

    </center>

    <!-- Fuer Lightbox -->
    <div id="lightbox-ovl"></div>
    <div id="lightbox">
        <img>
    </div>

</body>

</html>
Javascript:
//abgeaendert fuer Zeichnungen!

/**********************************************************
* Suzy's Javascript Photo Album, version 8.0, March 17, 2004
*
* Changed this version:  javascript is now in two seperate external
*                                      files, and put "spaces" in category names.
*
* This javascript may not be used on other sites without prior permission.
*
* You may contact me at photokity@hotmail.com for assistance.
*
**********************************************************/

self.name = "main"; // If you are using frames, change "main" to the name of the frame that the photoalbum is in.

current = 0; // Sets the current picture being shown to the first one.

ActiveVar = 0; // Sets up the variable that counts the pictures.
var ActiveArray = new Array() // Sets up the active array.
for (loop = 0; loop < MainVar; loop++) {
    ActiveArray[ActiveVar++] = new Fix(
        MainArray[loop].DatVal,
        MainArray[loop].PicVal,
        MainArray[loop].TitVal,
        MainArray[loop].CatVal,
        MainArray[loop].TxtVal,
        MainArray[loop].wImg, // !!! hinzu gefuegt
        MainArray[loop].hImg  // !!! hinzu gefuegt
    );
}

function DisplayCategories() { // Lists out the categories.
    TotalCategories = SuzyCategory.length;
    for (loop = 0; loop < TotalCategories; loop++) {
        document.write("<option value=" + SuzyCategory[loop] + ">" + ReplaceChars(SuzyCategory[loop]) + "</option>");
    }
}

function FindPic() { // The search for a photo feature.
    TotalFound = 0;
    SearchString = document.SuzyForm.SearchWord.value;
    SearchString = SearchString.toLowerCase();
    WriteResults = window.open("", "resultwindow", "height=410, width=490, toolbar=0, status=0, menubar=0, resizable=1, scrollbars=1");
    WriteResults.document.open();
    WriteResults.document.write('<style type=text/css>body{background:url(parchment.jpg); font:8pt verdana}'
        + 'a{text-decoration:none}'
        + 'img{border:2px ridge #ffaaaa; height:50px; vertical-align:middle}'
        + '</style>'
        + 'You searched for:  <i>' + SearchString + '</i>'
        + '<br>Category:  <i>' + parent.document.SuzyForm.CategoryDropdown.options.value + '</i>'
        + '<p><b>Results:</b><br>');
    for (loop = 0; loop < ActiveVar; loop++) {
        Keyword = ActiveArray[loop].TxtVal;
        Keyword = Keyword.toLowerCase();
        URL = ActiveArray[loop].PicVal;
        title = ActiveArray[loop].TitVal;
        title = title.toLowerCase();
        SearchResult = Keyword.indexOf(SearchString);
        SearchResult2 = title.indexOf(SearchString);
        if (SearchResult != "-1" || SearchResult2 != "-1") {
            WriteResults.document.write('<p><a href=javascript:ShowSuzyPic(' + loop + '); target="main"><img src=' + ActiveArray[loop].PicVal + '></a>  ' + title);
            TotalFound++;
        }
    }
    WriteResults.document.write('<p><b>Returned ' + TotalFound + ' results.</b><p><a href="javascript:window.close();">close window</a>');
    WriteResults.document.close();
}

function LoadPiclist() { // Loads initial list of pictures on web page.
    for (loop = 0; loop < MainVar; loop++) {
        document.write("<option value=" + ActiveArray[loop].PicVal + ">" + ActiveArray[loop].TitVal + "</option>");
    }
}

function LoadNextPic() { // Loads next picture for faster operation.
    NextImage = new Image();
    NextPic = current + 1;
    if (NextPic >= ActiveVar) NextPic = 0;
    NextImage.src = ActiveArray[NextPic].PicVal;
}

function NextSuzyPic() { // Flips to the next photo.
    TotalImages = document.SuzyForm.SuzyDropdown.options.length;
    current++;
    if (current >= ActiveVar) current = 0;
    ShowSuzyPic(current);
}

LoadThis = 0;
function PreLoader() { // If checked, preloads all images into cache.  Five second interval between pics.
    if (SuzyForm.PreloadPics.checked && ++LoadThis < MainVar) {
        ShowingImage = new Image();
        ShowingImage.src = MainArray[LoadThis].PicVal;
        window.status = "Pre-Loading image... '" + MainArray[LoadThis].PicVal + "'";
        RunLoader();
    } else {
        window.status = " ";
    }
}

function PreviousSuzyPic() { // Flips to the previous photo.
    current--;
    if (current < 0) current = ActiveVar - 1;
    ShowSuzyPic(current);
}

function RandomSuzyPic() { // Shows a random photo.
    randompic = Math.floor(Math.random() * ActiveVar);
    ShowSuzyPic(randompic);
}

function ReplaceChars(entry) { // Replaces the _'s in cat names to make it pretty.
    out = "_"; // replace this
    add = " "; // with this
    temp = "" + entry; // temporary holder
    while (temp.indexOf(out) > -1) {
        pos = temp.indexOf(out);
        temp = "" + (temp.substring(0, pos) + add +
            temp.substring((pos + out.length), temp.length));
    }
    return temp;
    // document.subform.text.value = temp;
}

function RunLoader() { // Pre-loads all images every 5 seconds, if checkbox is selected.
    timerLoad = setTimeout("PreLoader()", 5000)
}

function RunSlideShow() { // Shuffles the photos in a slide show.
    timerSlideShow = setTimeout("NextSuzyPic();", document.SuzyForm.Timer.value * 1000)
}

function ShowSuzyCategory(picked) { // Shows the pictures in that category.
    ActiveArray.length = 0;
    PicList = "<SELECT size=13 style='width:200px; font:8pt verdana' name='SuzyDropdown' onChange='ShowSuzyPic(SuzyForm.SuzyDropdown.options.selectedIndex);'>";
    ActiveVar = 0;
    current = 0;
    for (loop = 0; loop < MainVar; loop++) {
        if (MainArray[loop].CatVal.toLowerCase() == picked.toLowerCase() || picked == "all") {
            ActiveArray[ActiveVar++] = new Fix(MainArray[loop].DatVal, MainArray[loop].PicVal, MainArray[loop].TitVal, MainArray[loop].CatVal, MainArray[loop].TxtVal)
            PicList = PicList + "<option value=" + MainArray[loop].PicVal + ">" + MainArray[loop].TitVal + "</option>";
        }
    }
    PicList = PicList + "</select>";
    document.getElementById("PicSpot").innerHTML = PicList;
}

function ShowSuzyPic(newpic) { // Shows the photo and text on the page.
    current = newpic;
    SelectionBox = document.SuzyForm.SuzyDropdown;
    SelectionBox.options[current].selected = true;
    document.getElementById("SuzySpot").innerHTML = '<a href=javascript:SuzyPicRemote("' + ActiveArray[current].PicVal + '");><img name="PicShowing" src=' + ActiveArray[current].PicVal + ' height=200 border=0></a>';
    document.getElementById("journal").outerHTML = '<div id=journal><br><b>' + ActiveArray[current].TitVal + '</b><p>' + ActiveArray[current].DatVal + '<p style="text-align:justify; text-indent:25px">' + ActiveArray[current].TxtVal + '</div>';
    if (document.SuzyForm.WhereView[1].checked) {
        timerID = setTimeout("SuzyPicRemote(ActiveArray[current].PicVal)", 1000)
    }
    if (document.SuzyForm.SelectedMode[0].checked) {
        timerSlideShow = setTimeout("NextSuzyPic();", document.SuzyForm.Timer.value * 1000)
        LoadNextPic();
    } else {
        LoadNextPic();
    }
}

// Fuer Lightbox
document.addEventListener('DOMContentLoaded', function () {
    document.querySelector('#lightbox-ovl').addEventListener('click', function () {
        this.style.transform = 'scale(0)';
        document.getElementById('lightbox').style.transform = 'scale(0)';
    });
});

// Auf Lightbox umgestellt
function SuzyPicRemote(picName) { // Pops up the photo in a lightbox
    wImg = ActiveArray[current].wImg
    hImg = ActiveArray[current].hImg;
    wViewport = window.innerWidth;
    hViewport = window.innerHeight;
    var sqrt2 = Math.sqrt(2);
    var isPortrait = true;
    // Fenstergroesse festlegen abhaengig ob Hoch- oder Querfomat
    if (wImg < hImg) {  // Ist das Bild im Hochformat?
        var hLightbox = 900;
        var wLightbox = 900 / sqrt2;
    } else {
        isPortrait = false;
        var wLightbox = 900;
        var hLightbox = 900 / sqrt2;
    }

    // Passt das Fenster nicht in den Bildschirm, passen wir die Groesse an
    var fH = fW = 1;
    if (wLightbox > wViewport) {
        var fW = wViewport / wLightbox;
    }
    if (hLightbox > hViewport) {
        var fH = hViewport / hLightbox;
    }
    if (fH < fW) {
        factor = fH;
    } else {
        factor = fW;
    }
    wLightbox *= factor * 0.9;
    hLightbox *= factor * 0.9;

    var lightbox = document.getElementById('lightbox');
    var img = document.querySelector('#lightbox img');
    lightbox.style.width = wLightbox + 'px';
    lightbox.style.height = hLightbox + 'px';
    lightbox.style.top = (hViewport - hLightbox - 12) / 2 + 'px';
    lightbox.style.left = (wViewport - wLightbox - 12) / 2 + 'px';
    img.src = picName;
    if (isPortrait) {
        var factorImgW = wImg / 21;
        var factorImgH = hImg / 29.7;
    } else {
        var factorImgW = wImg / 29.7;
        var factorImgH = hImg / 21;
    }
    var wImg2 = wLightbox * factorImgW;
    var hImg2 = hLightbox * factorImgH;
    img.style.width = wImg2 + 'px';
    img.style.height = hImg2 + 'px';
    lightbox.style.transform = 'scale(1)';
    document.getElementById('lightbox-ovl').style.transform = 'scale(1)';
}
 
Zuletzt bearbeitet:

Sempervivum

Erfahrenes Mitglied
photoalbum-code-tablayout-lightbox.js
Oh, daran hatte ich jetzt nicht gedacht. Das ist das alte Javascript mit meiner Erweiterung für Lightbox. Das kannst Du umändern in photoalbum-code.js, so wie es bisher war und in diese Datei das Javascript, das ich gepostet habe, 1-zu-1 hinein, dann sollte es funktionieren.
 

Webhufi

Mitglied
Ja, ich hatte schon gesehen, dass du die zwei Zeilen verändert hast:

<script language="JavaScript" src="photoalbum-config-4.js"></script>
<script language="JavaScript" src="photoalbum-code-tablayout-lightbox.js"></script>

Ich hatte sie wieder umbenannt, nachdem ich deine Codes übernommen habe, aber trotzdem tut sich nichts...
 

Sempervivum

Erfahrenes Mitglied
Im HTML fehlt die Definition der Lightbox vor dem schließenden </body>:
HTML:
    <!-- Fuer Lightbox -->
    <div id="lightbox-ovl"></div>
    <div id="lightbox">
        <img>
    </div>

</body>
</html>
 

Webhufi

Mitglied
Flexlayout: Das wird mir alles zu kompliziert... Ebenfalls ist es nicht möglich, diese Seite in meinem responsiven CMS zu gestalten, das wird ebenfalls zu kompliziert. Also muss es eine externe Page bleiben, per iFrame eingebunden.
 
Status
Dieses Thema wurde gelöst! Zur Lösung gehen…

Neue Beiträge