Beiträge von Sempervivum

Sempervivum

Du kannst mit Flexlayout drei Spalten anlegen und die Bilder dort hinein tun:

HTML

<!DOCTYPE html>
<html lang="en">

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Galerie mit drei Spalen</title>
    <style>
        body {
            display: flex;
        }

        .col {
            flex: 1;
            display: flex;
            flex-direction: column;
        }

        .col img {
            width: 100%;
        }
    </style>
</head>

<body>
    <div class="col">
        <img src="images/dia0.jpg">
        <img src="images/dia1.jpg">
        <img src="images/dia2.jpg">
    </div>
    <div class="col">
        <img src="images/busleft.png">
        <img src="images/dia3.jpg">
        <img src="images/dia4.jpg">
    </div>
    <div class="col">
        <img src="images/01.png">
        <img src="images/02.png">
        <img src="images/03.png">

    </div>

</body>


</html>

Alles anzeigen

Sempervivum

Genau, Du musst nur die Tabelle anlegen, d. h. entweder mit deinem SQL:

Code

CREATE TEMPORARY TABLE fre2 like fre;

oder ebenfalls mit phpmyadmin, dann die Daten einlesen und dann übertragen mit dem letzten Teil ab update.

Sempervivum

Doch, das sind dann zwei Schritte:

Zunächst mit der Importfunktion die Daten in die temp. Tabelle laden.

Dann mit SQL die Daten in die Zieltabelle übertragen.

Sempervivum

Dieses Problem würde sich nicht stellen, wenn Du die Importfunktion von phpmyadmin verwenden würdest, dann hast Du keine Probleme mit Rechten und Pfaden.

Sempervivum

Zitat

worauf bezieht sich das Pfad '/tmp/your_file.csv' bei LOAD DATA INFILE

Ist das das Verzeichnis auf meinem Computer oder ist das das Verzeichnis auf dem Apache-Server?

Das ist die Datei auf dem Server. Aber bei dem Verfahren, das ich selber beschrieben habe, ist das gar nicht relevant, weil Du dann die Datei manuell mit dem Filemanager auswählst. Wie ich oben schrieb:

Zitat

kannst die Import-Funktion von phpmyadmin verwenden, dann kannst Du sie auf deinem lokalen Dateisystem auswählen und sie wird automatisch hochgeladen und eingelesen.

Zitat

Außerdem können die Daten in meiner Tabelle nicht durch Kommas getrennt sein.

Du kannst jedes beliebige Zeichen als Trennzeichen verwenden, auch ; |` etc., Du musst dieses nur beim Export angeben. Wenn dieses Zeichen in deinem Text vorkommen sollte, kannst Du die Einträge in Hochkommas einschließen und das Trennzeichen ggf. escapen.

Wenn Du damit nicht zum Ziel kommst, dann poste mal ein paar Beispieleinträge, die das Problem demonstrieren.

Sempervivum

Ich habe es mal mit Testtabellen und -dateien durch gespielt und es hat problemlos funktioniert. Du brauchst die Datei mit den Daten nicht selber hochzuladen, sondern kannst die Import-Funktion von phpmyadmin verwenden, dann kannst Du sie auf deinem lokalen Dateisystem auswählen und sie wird automatisch hochgeladen und eingelesen.

Du schreibst zwar: "Ich will keine neue Tabelle in phpmyadmin hochladen" aber wenn man den Angaben bei Stackoverflow folgt, musst Du das tun, und zwar zunächst die Daten in eine temporäre Tabelle laden, dann daraus die Daten in die Zieltabelle einfügen. Die temp. Tabelle kannst Du dann wieder löschen.

Die einzelnen Schritte sehen so aus:

1. Spalte in der Zieltabelle auswählen, die sich als ID eignet, d. h. über die man einen Datensatz eindeutig identifizieren kann.

2. Temp. Tabelle erzeugen mit zwei Spalten: ID und Wert, der in die Zieltabelle eingefügt werden soll.

3. Mit phpmyadmin die neue Spalte in der Zieltabelle hinzu fügen.

4. Um sie leicht editieren und in phpmyadmin importieren zu können, die Datei mit den Daten am besten als CSV-Datei anlegen. Bei meinem Test sahen die Daten so aus:

Code

1,data1
2,data2
3,data3
4,data4
5,data5

5. Die temp. Tabelle in phpmyadmin auswählen und in der Werkzeugleiste oben auf "Importieren" klicken.

Format CSV auswählen, in "Spalten getrennt mit" das Komma stehen lassen, "Spalten eingeschlossen mit:" und "Spalten escaped mit" leer machen.

Dies ist der einfachste Fall. Wenn Deine Daten auch Kommas enthalten können, musst Du dies anpassen.

6. Import mit "OK" starten.

7. Wenn der Import erfolgreich war, die Daten mit SQL in die Zieltabelle eintragen:

SQL

UPDATE ZIELTABELLE D SET D.NEWCOL=(SELECT VALUE FROM TEMP WHERE ID=D.ID)

Wenn Du überprüft hast, dass die Daten richtig übernommen wurden, kannst Du die temp. Tabelle wieder löschen.

Sempervivum

Das liegt daran, dass für main die opacity auf 0.8 gestellt ist:

Code

#content_wrap main {
    background-color: #fff;
    opacity: 0.8;
    order: 2;
    width: 50%;
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
    margin: 0% 2% 0% 0%;
    border-top: 0.5em solid #009618;
    border-bottom: 0.188em solid #009618;
}

Alles anzeigen

Sempervivum

Eine Lösung wird hier beschrieben:

https://stackoverflow.com/questions/1025…redirect=1&lq=1

Sempervivum

Gern geschehen!

Vermutlich meinst Du die Pfeilfunktion und bist die Schreibweise mit function gewohnt.

Auch für die for-Schleife gibt es eine neuere, kompaktere Version:

https://wiki.selfhtml.org/wiki/JavaScrip…e/Array/forEach

Sempervivum

Bei mit funktioniert der Zugriff auch in der Funktion createKnights:

Code

    function createKnights() {

        const htmlFragment = document.createDocumentFragment();
            x = 0;   // X-Axis
            y = 0;   // Y-Axis

        for (let i = 0; i < knightsTotal; i++) {
            const image = document.createElement('section');
            image.classList.add('hero_img', 'class_knights');
            image.id = knightslist[i];
            htmlFragment.appendChild(image);
            image.style.backgroundPosition = x + '% ' + y + '%';
            image.addEventListener('click', e => {
                console.log(image.id + ' clicked')
            });
            moveAxis(x, y);          
        }
        bgHeroes.appendChild(htmlFragment);
    }

Alles anzeigen

Zitat

kann man die Id nur so holen: getElementById('neraxis') oder kann ich auch so: getElementById(knightlist[i])?

Selbstverständlich sollte das zweite auch funktionieren.

Sempervivum

Du erzeugst die Elemente erst im onload-Event. Füge ich dort eine Ausgabe ein, funktioniert es:

Code

    window.onload  = function () {
        viewClass[0].classList.add('classActiv');
        clearcontent('bgHeroes');
        createKnights();
        createWarriors();
        createAssassins();
        createArchers();
        createMechanics();
        createWizards();
        createPriests();
        console.log(document.getElementById('neraxis').id)
    }

Alles anzeigen

Ich vermute, Du hast versucht, außerhalb dieser Funktion zuzugreifen, als das Element noch nicht definiert war.

Sempervivum

PS: Eine Alternative könnte aber sein, das data-Attribut statisch einzuschalten, aber die Buttons, die dazu gehören, mit CSS unsichtbar zu machen. Das ginge dann auch mit Mediaqueries.

Sempervivum

Ich fürchte, mit Mediaqueries kann man nur CSS-Eigenschaften setzen aber keine Attribute

Siehe hier:

https://stackoverflow.com/questions/3760…with-mediaquery

Sempervivum

Bei mir funktioniert display: inline-block; schon, in dieser Demo nimmt der Container nur den Platz entspr. dem Inhalt ein und ist zentriert ausgerichtet:

HTML

<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <style>
        ul.slides li {
            text-align: center;
        }

        ul.slides {
            list-style-type: none;
        }

        .container {
            display: inline-block;
        }
    </style>
</head>

<body>
    <div class="hero hero-slider">
        <ul class="slides">
            <li data-bg-image="images/dia0.jpg">
                <div class="container" style="background:rgba(21,18,21,0.7)">
                    <h2 class="slider-title">Willkommen</h2>
                    <p>Text ...</p>
                    <p>Text ...</p>
                </div>
            </li>
        </ul>
    </div>
</body>


</html>

Alles anzeigen

Sempervivum

Bei dem Fiddle muss ich doch vorsichtig Bedenken anmelden:

1. ul als direktes Kind von ul ist nicht valide

Zitat

Error: Element ul not allowed as child of element ul in this context.

2. Die Beschreibung gehört zu dem Bild und sollte daher sowohl aus semantischen als auch funktionalen Gründen in dem li mit dem Bild liegen.

3. Fraglich, ob eine Liste für die Beschreibung in diesem Fall semantisch sinnvoll ist. Wahrscheinlich liegt der TO mit Überschrift und Absätzen schon richtig.

4. Löst nicht das Problem des TO, denn die Beschreibung nimmt nach wie vor nach rechts die gesamte Fensterbreite in.

html-seminar.de/woltlab/attachment/2215/

Sempervivum

basti1012 So ist es natürlich eine Kleinigkeit, wenn alle Zellen die selbe Breite haben. Der Knackpunkt hier ist jedoch, dass sich die Zellen variabel an den Inhalt anpassen sollen. Der TO schreibt ja:

Zitat

wie ich die Breite der einzelnen divs definiere. Denn diese ergibt sich ja erst aus dem Platz der einzlenen divs welche die Daten brauchen.

Außerdem ist das wesentliche bei Flex, dass sich die Container an den Inhalte anpassen. Der Tabellenkopf hat bei dir jedoch eine feste Höhe.

Sempervivum

Ich empfehle, etwas bewährtes zu verwenden, nämlich datatables:

https://datatables.net/examples/basic_init/scroll_y.html

Vielfältig konfigurierbar, z. B. können nicht benötigte Features ausgeschaltet werden.

Sempervivum

Das ist natürlich blöd. Ich hatte es auch getestet und zufällig ein Beispiel mit px gewählt, so dass mir dies nicht aufgefallen ist. Dann kommt dieser Weg für dich also nicht in Frage.

Sempervivum

Diesen Link habe ich unter meinen Lesezeichen, dort sind die Grundlagen ganz gut erklärt:

https://danielfett.de/2006/03/20/reg…uecke-tutorial/

Sehr gut zum Lernen und zum Testen ist diese Seite:

https://regex101.com

RegEx ist sehr mächtig und es lohnt sich auf jeden Fall, sich darin einzuarbeiten. Unabhängig von dieser Aufgabe gibt es sehr viele Einsatzmöglichkeiten.

Sempervivum

In einem anderen Thread hast Du ja schon den Hinweis bekommen, dass ein HTML-Dokument in PHP mit DOMDocument geparsed werden kann. Möglicher Weise ist dies subjektiv, weil ich mit Javascript und CSS besser vertraut bin, aber ich fand es immer eine Qual, das Ergebnis auszuwerten, mit xpath oder so geht das, aber die Syntax ist sehr kryptisch.

Ich weiß auch gar nicht, ob dort externes CSS berücksichtigt wird, müsstest Du mal recherchieren.

Unabhängig ob PHP oder JS:

Bei Auswerten oder Parsen von Strings, wie Du es in dem Code oben für die Maßeinheit der Schriftgröße machst, geht alles viel einfacher, wenn Du RegEx verwendest. In deiner Funktion isBlank() tust Du das ja schon.

Beiträge von Sempervivum

CSS 3 Spaltenlayout

Daten aus einer Textdatei in die MySql-Tabelle laden

Daten aus einer Textdatei in die MySql-Tabelle laden

Daten aus einer Textdatei in die MySql-Tabelle laden

Daten aus einer Textdatei in die MySql-Tabelle laden

Daten aus einer Textdatei in die MySql-Tabelle laden

Images werden trüb dargestellt.

Daten aus einer Textdatei in die MySql-Tabelle laden

Erstellte id zugreifen, wie?

Erstellte id zugreifen, wie?

Erstellte id zugreifen, wie?

Data Paging gößenanhängig machen

Data Paging gößenanhängig machen

div Breite an Inhalt anpassen

div Breite an Inhalt anpassen

Position fixed und sticky in ie11

Position fixed und sticky in ie11

Mit Javascript eine CSS-Datei Parsen - wie geht das?

HTML-Code mit PHP analysieren - geht das?

HTML-Code mit PHP analysieren - geht das?