Beiträge von Sempervivum

Offenbar liegt hier ein Konflikt mit der Bibliothek Prototype vor, die ebenfalls $ definiert. Das Problem ist bekannt und hier wird die Lösung beschrieben:

https://learn.jquery.com/using-jquery-c…ther-libraries/

Hast Du die Fehleranzeige für PHP eingeschaltet und einen Blick in die Console des Browsers geworfen? Ich habe da eine kleine Testdatei gemacht, natürlich ohne das ganze Drumherum und damit funktioniert es.

Zitat

Wird offensichtlich nicht ausgegeben.

Dann würde ich zunächst den GET-Parameter prüfen, ob er richtig gesetzt ist:

var_dump($_GET);

Außerdem sollte dieser in der Adresszeile des Browsers sichtbar sein.

Wenn ich dein erstes Posting lese, vermute ich, dass die PHP-Datei eine andere ist als die, in der das Formular steht?

Sieht plausibel aus.

Hast Du dir die Quelltextansicht im Browser angesehen, ob das Script-Tag dort angezeigt wird, so wie Du es im PHP-Skript ausgegeben hast?

Ist zuvor auch die Funktion messageToServer definiert worden?

$_GET entspricht dem method-Attribut in deinem Formular? GET ist offenbar Default.

Ein direkter Weg wäre u. U. das Python-Skript von PHP aus zu aktivieren.

Zitat

wichtig ist, dass die Kommunikation zum Python-Programm erst nach dem erfolgreichen schreiben der XML-Datei erfolgt.

Dann ist es durchaus wahrscheinlich, dass es ein Timing-Problem ist. Ich sehe da zwei Lösungsmöglichkeiten:

1. Die Daten mit Ajax an den Server zu schicken. Dann hast Du einen Success-Handler, der aufgerufen wird, wenn das PHP-Skript erfolgreich ausgeführt wurde und kannst darin das messageToServer aufrufen.
2. Beim Abschicken des Formulars wird die Seite neu geladen. Du kannst das messageToServer beim Neuladen der Seite aufrufen. Ein gängiges Kriterium dafür ist, dass die GET-/POST-Variable für "submitSave" gesetzt ist.

Wie es geht, wird hier beschrieben:

https://stackoverflow.com/questions/1559…pacity-gradient

Wenn Du es auf deinen Code nicht anwenden kannst, dann poste den Code der Lösung für die Du dich entschieden hast.

Wenn ich schrieb, dass es nicht geht, meinte ich die Suche in der Verzeichnissen, wie Du sie ganz am Anfang beschrieben hast. Das Austauschen des Sprachenkürzels in der URL braucht in der Tat kein PHP und geht problemlos mit JS, wie ich es vorgeschlagen und Du umgesetzt hast.

Der Grund ist, dass die vertikale Ausrichtung per Default auf baseline steht und Du kannst den Effekt beseitigen, indem Du es auf top setzt:

img.img-fluid {
    vertical-align: top;
}

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

Bei weiterer Überlegung bin ich der Erklärung näher gekommen: Übergibt man eine Funktionsreferenz, so ist dies nur die Referenz der betr. Funktion, ohne Informationen über den Kontext. Aus der Notation window.setTimeout(schools.lower, 2500); ist zwar ersichtlich, dass lower eine Funktion von schools ist, aber in der Referenz, die an setTimeout übergeben wird, ist diese Info nicht enthalten.

Ich habe eine Lösung, aber keine Erklärung:

Der Debugger zeigt, dass in schools.lower this das window-Objekt ist und nicht schools. Ändere ich die Zeile, indem ich eine anonyme Funktion verwende, die lower aufruft, funktioniert es:

        function renew_all() {
            schools.change();
            schools.bigger();
            window.setTimeout(function () { schools.lower() }, 2500);
            window.setTimeout(renew_all, 4000);
            //renew_all();
        }

Vielleicht kann jemand mit tieferen Kenntnissen erklären, warum das so ist.

Der Grund ist, dass Du die betr. Listenpunkte absolut positioniert hast, ohne eine Position anzugeben. Ändere folgendes:

• Lösche position:absolute; bei den Listenpunkten der Untermenüs.
• Gib den Listenpunkten im Hauptmenü ein position:relative; und den uls der Untermenüs ein position: absolute; und ein top: 100%;.
• Beim Hover gib dem ul der Untermenüs ein display: flex; und flex-direction: column;
• Entferne alles float bei den Untermenüs.

Dann sieht es so aus:

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

Feinheiten müssen noch etwas überarbetet werden, z. B. muss die Position noch etwas weiter herunter.

Die Seite wird über https geladen, jQuery jedoch nicht. Lade jQuery auch über https, dann sollte es funktionieren.

BTW: Wenn Du das Javascript an das Ende stellst, brauchst Du weder $(document).ready(function(){ noch $(function () {.

Ich würde es nicht mit dem Setzen des Attributes machen sondern mit addEventListener:

1. Du hast da zwei Mal das Semikolon vergessen: In Zeile 3 und in Zeile 9.

2. Damit das Hover funktioniert, kannst Du mein CSS aus #3 fast 1-zu-1 übernehmen, nur verwendest Du jetzt Klassen und musst daher die # durch Punkte ersetzen:

        .obj_1:hover~.obj_2 {
            opacity: 0;
        }

        .obj_1 {
            width: 30px;
            height: 30px;
            background-color: blue;
        }

        .obj_2 {
            width: 30px;
            height: 40px;
            margin: 30px;
            background-color: green;
            transition: opacity 0.5s;
        }

Ich habe ja auch nicht definitiv gesagt, dass eine Tabelle mehr zu empfehlen ist. Ich würde jedoch von float abraten. Außerdem ist es mir sympatischer, wenn die Daten, die zusammengehören, auch zusammenstehen. Auf diese Weise habe ich folgendes gemacht:

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>Test Tabelle</title>
    <style>
        #Text {
            background-color: #acacd5;
            left: 2em;
            bottom: 2em;
            overflow-x: scroll;
            font-size: 5em;
            display: flex;
        }

        .Spalte {
            display: flex;
            flex-direction: column;
        }

        .Spalte div {
            height: 1em;
            white-space: nowrap;
            padding: 0.2em;
        }

        .Spalte div:nth-child(1) {
            background-color: lightblue;
        }

        .Spalte div:nth-child(2) {
            background-color: lightsalmon;
        }

        .Spalte div:nth-child(3) {
            background-color: lightgreen;
        }
    </style>
</head>

<body>
    <div id="Text">
        <div class="Beschriftung Spalte">
            <div>Name:</div>
            <div>Straße:</div>
            <div>Ort:</div>
        </div>
        <div class="Spalte">
            <div>Bernd</div>
            <div>Hamburger Straße</div>
            <div>Berlin</div>
        </div>
        <div class="Spalte">
            <div>Ulrich</div>
            <div>Schulweg</div>
            <div>Dresden</div>
        </div>
        <div class="Spalte">
            <div>Werner</div>
            <div>Stralsundstraße</div>
            <div>Hannover</div>
        </div>
    </div>
</body>

</html>

Also mit Flexlayout. U. U. wäre Gridlayout besser gewesen, aber ich empfehle das nicht gern, weil es von IE11 nicht richtig unterstützt wird.

Zitat

dass man table gar nicht mehr so nutzt?

So pauschal sollte man das nicht sagen. Es trifft zu, dass man Tabellen besser nicht für Layoutzwecke verwenden sollte. Für die Darstellung von Daten, die tabellarischer Natur sind, ist nichts dagegen einzuwenden, Tabellen zu verwenden. Auf der einen Seite trifft das auf deine Daten zu, auf der anderen Seite auch wieder nicht, weil die Überschriften vertkal in der linken Spalte stehen statt horizontal im Kopf.

Verstehe. Ist sicher machbar, aber mir im Moment zu kompliziert. Für sich gesehen, wäre es noch relativ einfach, diese Seiten horizontal zu sliden, aber man müsste es in das vorhandene Skript integrieren und das macht es ein wenig kompliziert.

Vielleicht macht es jemand anders.

Verstehe nicht ganz: Weder im oberen noch im unteren Bereich sehe ich Pfeile nach links und rechts, sondern oben navigiert man durch horizontales Wischen? Oder meinst Du das Weiterschalten mit den Pfeiltasten?

Dieses CSS:

.uk-margin-top uk-button uk-button-large uk-button-danger {
    display: none;
}

wird nicht funktionieren, denn es würde bedeuten:
Das Element mit dem Namen "uk-button-danger" (also nicht der Klasse) ist ein Nachfahre des Elementes mit dem Namen "uk-button-large" und dieses ist ein Nachfahre des Elementes mit dem Namen "uk-button" und dieses ..., siehe hier:

https://wiki.selfhtml.org/wiki/CSS/Selek…ahrenkombinator

Richtig wäre dieses:

.uk-margin-top.uk-button.uk-button-large.uk-button-danger {
    display: none;
}

Allerdings ist es auf jedenfalls empfehlenswert, einen Selektor zu verwenden, der spezifischer ist als diese Klassen, wie von Justus vorgeschlagen.

Das geht relativ leicht auch mit CSS aber mit Einschränkungen bzgl. der Anordnung:

• Das zweite Element muss ein Geschwisterelement oder ein Kind eines Geschwisterelementes des ersten Elementes sein.
• Das zweite Element muss nach dem ersten notiert werden.

Es gibt aber auch einen Vorteil: Mit CSS-Transition oder -Animation können viele Eigenschaften einfach animiert werden.

<style>
        #obj_1:hover~#obj_2 {
            opacity: 0;
        }

        #obj_2 {
            transition: opacity 0.5s;
        }
    </style>
    <!-- Dein Objekt in HTML. Als Beispiel ein Button -->
    <input type="button" id="obj_1" />
    <!-- Dein zweites Objekt -->
    <div id="obj_2">
        <input type="button" />
    </div>