Beiträge von Sempervivum
-
-
langi schrieb:Es ist eines der originalen Bilder
Mit diesem:
Sempervivum schrieb:Ich bin aber unsicher ob das das originale Bild ist, nicht auszuschließen, dass es vor/beim Hochladen oder beim Einfügen in das Posting bearbeitet wurde.
Meinte ich nicht eine Bearbeitung durch dich sondern eine automatische durch die Forensoftware.
Hast Du deinen Code denn jetzt mit mehreren Bildern getestet oder ist es nur eines, das nicht funktioniert?
-
Stellt sich die Frage ob es
a) an deiner Installation der gdlib liegt oder
b) an dem fraglichen Bild.
Zu b) ich habe das getestet mit dem Bild, das Du gepostet hast und damit hat das imagecreatefromjpeg einwandfrei funktioniert. Ich bin aber unsicher ob das das originale Bild ist, nicht auszuschließen, dass es vor/beim Hochladen oder beim Einfügen in das Posting bearbeitet wurde. Ich nehme mal an, Du hast es mit mehreren Bildern versucht? Hast Du das @ auch vor dem imagecreatefromjpeg entfernt?
Zu a) Bei mir unterscheidet sich die Version von libJPEG, bei mir 9, bei dir 6b aber keine Ahnung ob das von Bedeutung ist. Wie ist denn deine Installation von PHP und gdlib entstanden?
-
Poste doch mal ein Beispielbild als Anhang (sofern es nicht vertraulich ist).
-
Und ist das Bild auch wirklich vom Typ JPG? Es ist schon vorgekommen, dass sich ein Format in der Datei versteckt, das anders ist als die Endung angibt.
-
Mit der temporären Datei meinte ich nur, dass Du die geänderte Version mit einem anderen Dateinamen speicherst, z. B. index-test.html.
Was ich selber beobachte ist, dass die Seite zu der Position scrollt wo der Anker #nav-menue liegt und der Button nach oben verschwindet. Das ist genau der Grund, warum ich kein Freund von diesem Verfahren mit Ankern und :target bin: Man hat mit ungewollten Nebeneffekten zu kämpfen. Besser den Checkbox-Trick verwenden oder Javascript.
Checkbox-Trick ist z. B. hier beschrieben:
-
Wie ich schon schrieb, empfehle ich nicht, an dem Bootstrap-Modal herum zu schrauben sondern es selbst zu machen. Man findet leicht Scripts für das Dragging und ein Modal ist auch kein Hexenwerk. Z. B hier:
https://blog.pliszko.com/2021-…thout-external-libraries/
Das funktioniert auch für Touch-Geräte.
Das könnte dann so aussehen:
Alles anzeigenHTML- <!DOCTYPE html>
- <html lang="de">
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Bootstrap Modal Draggable</title>
- <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
- <style>
- html,
- body {
- height: 100%;
- }
- .my-modal {
- display: inline-block;
- min-width: 50%;
- border: 2px solid lightgray;
- border-radius: 0.5rem;
- background-color: white;
- }
- </style>
- </head>
- <body>
- <!-- Modal 1 -->
- <div id="my-modal-1" class="my-modal">
- <header class="handle modal-header">
- <button class="close" aria-label="Close"><span aria-hidden="true">×</span></button>
- <h4 class="my-modal-title">Modal 1</h4>
- </header>
- <main class="modal-body">
- Modal Body
- </main>
- <footer class="modal-footer">
- <button class="btn btn-default close">Close</button>
- </footer>
- </div>
- <!-- Modal 2 -->
- <div id="my-modal-2" class="my-modal">
- <header class="handle modal-header">
- <button class="close" aria-label="Close"><span aria-hidden="true">×</span></button>
- <h4 class="my-modal-title">Modal 2</h4>
- </header>
- <main class="modal-body">
- Modal Body
- </main>
- <footer class="modal-footer">
- <button class="btn btn-default close">Close</button>
- </footer>
- </div>
- <script>
- function simpleDraggable(elementSelector, handleSelector) {
- const elements = document.querySelectorAll(elementSelector);
- if (elements.length === 0) {
- throw Error(`Elements matching selector ${elementSelector} not found`);
- }
- const getCursorPositionFromEvent = (e) => {
- if (e.touches && e.touches.length > 0) {
- return {
- x: e.touches[0].clientX,
- y: e.touches[0].clientY,
- };
- } else {
- return {
- x: e.clientX,
- y: e.clientY,
- };
- }
- };
- for (let element of elements) {
- let handle;
- if (handleSelector) {
- handle = element.querySelector(handleSelector);
- }
- element.style.position = 'absolute';
- let cursorPositionX = 0;
- let cursorPositionY = 0;
- const start = (e) => {
- e.preventDefault();
- // get initial cursor position
- const cursorPosition = getCursorPositionFromEvent(e);
- cursorPositionX = cursorPosition.x;
- cursorPositionY = cursorPosition.y;
- document.addEventListener('mousemove', dragging);
- document.addEventListener('touchmove', dragging);
- document.addEventListener('mouseup', stop);
- document.addEventListener('touchend', stop);
- document.addEventListener('touchcancel', stop);
- };
- const dragging = (e) => {
- e.preventDefault();
- // get new cursor position
- const cursorPosition = getCursorPositionFromEvent(e);
- // calculate position change
- const positionChangeX = cursorPositionX - cursorPosition.x;
- const positionChangeY = cursorPositionY - cursorPosition.y;
- // save new cursor position
- cursorPositionX = cursorPosition.x;
- cursorPositionY = cursorPosition.y;
- // set the element's new position:
- element.style.left = `${element.offsetLeft - positionChangeX}px`;
- element.style.top = `${element.offsetTop - positionChangeY}px`;
- };
- const stop = () => {
- document.removeEventListener('mousemove', dragging);
- document.removeEventListener('touchmove', dragging);
- document.removeEventListener('mouseup', stop);
- document.removeEventListener('touchend', stop);
- document.removeEventListener('touchcancel', stop);
- };
- if (handleSelector && handle) {
- handle.addEventListener('mousedown', start);
- handle.addEventListener('touchstart', start);
- } else {
- element.addEventListener('mousedown', start);
- element.addEventListener('touchstart', start);
- }
- }
- }
- simpleDraggable('.my-modal', '.handle');
- // Eventlistener für das Schließen der Modal registrieren:
- document.addEventListener('click', event => {
- const
- tgt = event.target,
- btn = tgt.closest('button.close'),
- parentModal = tgt.closest('div.my-modal');
- if (btn.matches('button.close') && parentModal) {
- parentModal.style.display = 'none';
- }
- });
- // das folgende nur damit die Modale nicht übereinander liegen:
- const
- boundingRect = document.querySelectorAll('.my-modal')[0]
- .getBoundingClientRect(),
- hModal = boundingRect.height;
- document.querySelectorAll('.my-modal')[1].style.top = hModal + 'px';
- </script>
- </body>
- </html>
-
Zitat
dass die Eigenschaft auf Buttons im Hintergrund verloren gegangen ist.
Wahrscheinlich meinst Du damit, dass die Buttons der Modale im Hintergrund nicht auf Klicks reagieren. Das habe ich auch fest gestellt und es liegt daran, dass das oberste div div.modal.fade, wenn auch unsichtbar, das gesamte Browserfenster ausfüllt und die Klicks auf die Buttons der anderen Modale abfängt.
-
Ich bin jetzt nichts ins Detail eingestiegen und habe auch keine getestete Lösung, aber folgende Hinweise:
- Du schriebst: "Allg. scheint mir ich habe das gleiche Problem, ob die Variable eine Sessionsvariable ist oder nicht." Eine Sessionvariable hat den Vorteil, dass dir der Wert beim Neuladen der Seite bzw. dem Abschicken des Formulars erhalten bleibt.
- Dieses: "Heisst, es erfolgt eine Zwischenspeicherung falls es Fehlermeldungen hat, damit bei Fehlermeldungen die bereits mutierten Daten nicht verloren gehen und nur wieder der ursprüngliche Datensatz im Formular erscheint und alles wieder neu eingegeben werden muss." würde sich wesentlich einfacher gestalten wenn Du die Daten mit Ajax zum Server schicken würdest, dann bleibt das Formular wie es ist und Du brauchst nichts zwischenzuspeichern.
- Eine clientseitige Validierung zusätzlich zur serverseitigen würde das Ganze für den Benutzer angenehmer gestalten. Mit der HTML5-Formularvalidierung ist das ja heute schnell getan.
-
Zitat
( Code kann ich noch nachreichen...)
Das ist sicher angebracht oder, besser noch, wenn die Seite online wäre und Du die URL posten würdest. Du kannst ja eine temporäre Datei anlegen, damit etwas, das nicht richtig funktioniert, nicht öffentlich ist.
-
Verstehe, dann bist Du ja schon weiter als ich dachte
Das müsste sich lösen lassen, indem Du eine Zustandsvariable als Sesssion-Variable führst: Beim ersten Abschicken des Formulars ist diese nicht gesetzt und Du fügst den Datensatz in die Datenbank ein. Sobald das erfolgreich war, setzt Du diese Variable und wenn dann das Formular noch mal abgeschickt wird, machst Du ein Update.
-
Bootstrap unterstützt das gleichzeitige Anzeigen von mehreren Modalen nicht:
https://getbootstrap.com/docs/…al/#toggle-between-modals
ZitatPlease note multiple modals cannot be open at the same time—this method simply toggles between two separate modals.
Man findet diverse Tricks, um diese Beschränkung zu umgehen, z. B. hier:
https://stackoverflow.com/ques…1/multiple-modals-overlay
aber ich würde das nicht empfehlen. Besser selber Hand anlegen und die Modale erzeugen.
-
Einen Fehler habe ich noch überlesen: In Variablennamen ist kein Minuszeichen erlaubt, weil das für die Subtraktion vorgesehen ist. Ändere den Namen so:
-
-
Da gibt es zwei Möglichkeiten:
1. Einfach zu realisieren: Die Daten mit Ajax zyklisch vom Server holen. Nachteil: Die Daten werden nicht spontan akualisiert sondern mit einer kleinen Verzögerung; Daten werden auch abgefragt wenn gar nichts Neues da ist.
2. Komplizierter zu realisieren: Die Daten vom Server aus mit der Websocket-API an den Browser senden. Vorteil: Die Daten werden nur dann gesendet, wenn es auch erforderlich ist.
-
Zitat
unter der neu bestehenden ID abgespeichert werden (wie definiert man das?).
Ich nehme an, das ist dein Kernproblem: Ein Update mit unveränderter ID ist kein Problem aber Du willst unter neuer ID speichern?
Das einfachste wäre, das betr. Feld in der Datenbank als autoincrement zu definieren, die DB würde dann bei "INSERT" eine neue ID automatisch fest legen.
-
Hallo Uli,
Zitatdass man die Navil-Leiste ab Unterschreitung einer bestimmten Bildschirmbreite ausblenden und durch eine andere Anordnung ersetzen könnte.
Das möchte ich aber nicht, da sie aus einem Hintergrundbild und Textgrafiken besteht, die nur senkrecht passen.
Das verstehe ich nicht ganz, diese Nav ist ja schon vertikal und ließe sich gut auf einem vertikal gehaltenen Handy darstellen.
Zitatkann ab Unterschreitung einer bestimmten Bildschirmbreite die starre Navi-Spalte durch eine identische, kleinere, schmälere aber auch wieder starre Navi-Spalte ersetzt werden ?
Möglich ist das auf jeden Fall. Ich befürchte jedoch, dass Du immer Probleme mit dem Platz haben wirst, wenn Du die Navileiste fest sichtbar behältst. Besser das bewährte Verfahren, dass die Navileiste bei schmalem Bildschirm nur bei Bedarf eingeblendet wird.
Beste Grüße - Ulrich
-
Hallo Johann,
der Grund ist, dass Du beim ersten Eingabefeld das Attribut "autofocus" gesetzt hast. Das Element zu fokussieren macht ja nur Sinn, wenn es auch im sichtbaren Bereich liegt und deshalb scrollt der Browser automatisch nach unten. Wenn Du das Attribut löschst, verschwindet dieses Verhalten.
Beste Grüße - Ulrich
-
Ich weiß nicht warum das mit width nicht funktioniert aber mit min-width geht es: min-width: 130px !important;
IMO ist es jedoch besser, den Zeilenumbruch zu unterdrücken, dann nehmen die Zellen genau so viel Platz ein wie es der Inhalt erfordert und Du läufst nicht Gefahr, dass eine feste Breite zu klein oder zu groß ist: white-space: nowrap;
Edit: Wahrscheinlich findet man den Grund hier:
https://stackoverflow.com/ques…-or-not-followed/14778078
in He Huis Antwort:
Zitat- Table width will always override TD width.
- Stated TD width will only be followed until it exceeds viewport width, and viewport width will be taken as priority.
-
Wie ich vermutet hatte: Für button wird in Zeile 137 eine Breite von 25% eingestellt. Deaktiviere ich das, sind die Buttons genau so breit wie der Text darin es erfordert.