Vielleicht hilft Dir das weiter - https://xuad.net/artikel/xampp…will-wieder-nicht-starten
Beiträge von Lupus_III
-
-
m.scatello: Ich habe keine tiefen JS-Kenntnisse. Trotzdem habe ich es mit deiner Hilfe und ein Bisschen probieren hinbekommen. Danke!
-
Hallo kann mir jemand weiterhelfen. Ich möchte, dass die Weiterleitung https://www.google.de/search auf einen neuen Tab erfolgt. Also wie bei HTML target="_blank". Ich habe keine Idee wie man das macht.
Danke!
Code
Alles anzeigen<script type="text/javascript"> function suchen(){ var s =document.getElementById("suche").value; window.location = "https://www.google.de/search?q=" + s; } function Event_Key() { if(event.keyCode == 13) { suchen(); } } </script> -
Hallo zusammen,
zur Zeit, so meine ich, sind die Fonts Roboto und Poppins für Webseiten gerade in Mode. Welche Fonts benutzt Ihr?
Ich bin gespannt.
-
Sorry, wenn ich so deutlich werde, aber mich kotzen viele Websites einfach nur noch an. Da werden sämtliche Möglichkeiten, angefangen bei der Grafik über PHP und JS, reingepackt. Alles ist in Bewegung, ständig ein Popup und die Navigation ist nur noch rudimentär vorhanden. Wann kommen wir wieder zurück zu einfacheren Seiten mit schnell erreichbarem Inhalt über eine leicht zu bedienenden Navigation. Weniger ist oft mehr.
-
Warum machst du zum Lernen nicht einfach diesen kostenlosen Kurs? -> https://www.html-seminar.de/
und dann schau da mal rein -> https://www.w3schools.com/howt…nsive_navbar_dropdown.asp -
Oh Mann!!!
Danke Basti, das war es. -
Ich weiß nicht, warum das script nicht wie gewünscht funktioniert und der Text im Kreis um das Bild läuft. Kann jemand helfen
HTML
Alles anzeigenHTML <!DOCTYPE html> <html lang="de"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style.css"> <title>Document</title> </head> <body> <div class="circle"> <div class="logo"></div> <div class="text"> <p>LUPUS-Media - Erich Wolf - Creative Web-Design</p> </div> </div> <script> const text = document.querySelector('.text p'); text.innerHTML = text.innerText.split("").map( (char, i) => <span style="transform:rotate(${i * 8.2}deg)">${char}</span> ).join(""); </script> </body> </html>Code
Alles anzeigenCSS * { margin: 0; padding: 0; box-sizing: border-box; font-family: consolas; } body{ display: flex; justify-content: center; align-items: center; min-height: 100vh; } .circle { position: relative; width: 200px; height: 200px; border-radius: 50%; /*background-color: #ccc;*/ display: flex; justify-content: center; align-items: center; } .logo { position: absolute; width: 150px; height: 150px; border-radius: 50%; background: url(img.jpg); background-size: cover; filter: brightness(1.5) contrast(1); } .text { position: absolute; width: 100%; height: 100%; animation: rotateText 10s linear infinite; } @keyframes rotateText { 0%{ transform: rotate(360deg); } 100%{ transform: rotate(0deg); } } .text span { position: absolute; left: 50%; font-size: 1.2em; transform-origin: 0 100px; } -
Auf den ersten Blick sieht es aus, wie wenn der Container für die Subnavigation nicht genügend Breite hat. Aber ohne Code kann man keine genauere Aussage machen.
-
Der häufige Reload ist zwar nicht optimal und verursacht unnötige Serverlast aber nicht der Grund für das Flackern und das unvollständige Bild.
Auch das PHP ist ein Overkill an Komplexität weil die URL des Bilder ja immer die selbe ist.
Hast du auch Lösungen?
-
Alles anzeigen
Bei mir wird es richtig angezeigt.
Aber,
Beim 2 Minuten Reload werden Einzel Bilder geladen, die von oben aus immer etwas größer werden , bis das Bild vollständig ist , so wie es 1996 mit isdn mal wahr.
Ist das Bild erst mal da , wird jede Sekunde das Bild neu geladen (Siehe Konsole)
Irgendwie merkwürdig mit den Requesten , vielleicht kann da mal wer anders schauen, ob bei ihm in der Konsole auch so viel los ist auf der Seite.
Edit :
Bei ein
CodesetTimeout( reload, 1210 );ist das natürlich klar das da soll viele Reloads laufen (ca. 30 MB die Minute).
Wie muss ich den reload einstellen, damit es besser wird? sind 1210 Millisekunden?
-
Bei mir immer noch arges Geflacker ca. alle 2 min
Hast du eine Idee?
-
Ich habe mittlerweile das reload auf 1210 hochgesetzt. Ich denke das war die Lösung.
-
Was meinst du mit "pumpt"??
Schau Dir bitte den Link an.
-
Hallo zusammen,
wir haben in unserem Club eine neue Webcam installiert, die im Abstand von 2 Minuten Fotos (Snap.jpg) zum Webserver hochlädt.
https://www.golfclub-oberrot-frankenberg.de/webcam.html
Die Fotos werden in einer speziellen HTML-Datei (siehe Link) angezeigt. Leider pumpt dabei das Bild so lange, bis es komplett übertragen wurde. Ich kann mir dieses Verhalten nicht erklären.
Kann jemand mal auf die relevanten Dateien schauen und evtl. eine Lösung finden? Danke!
PHP
Alles anzeigenHTML <!DOCTYPE html> <html> <head> <title>Webcam Golfclub Oberrot-Frankenberg</title> <meta charset="UTF-8"> <link rel="stylesheet" href="webcam.css" media="screen"> <script type="text/javascript" src="webcam.js"></script> </head> <body> <h2>Webcam des Golfclubs Oberrot-Frankenberg</h2> <p>Die von der Webcam erzeugten Bilder werden im Abstand von 2 Minuten erneuert.</p> <div class="camview"><img src="{__LAST_IMAGE__}" alt="WebCam StopMotion View"><p>{__DATETIME__}</p></div> <p>Datum der letzten Änderung</p> </body> </html> *************************************************************************************************************** PHP <?php date_default_timezone_set( 'Europe/Berlin' ); error_reporting( -1 ); ini_set( 'display_errors', true ); const IMAGES_PATH_NAME = 'images/webcam/WLAN_Cam/Snapshot/'; const IMAGES_PATH = __DIR__ . '/' . IMAGES_PATH_NAME; const IMAGES_PATTERN = 'Snap.jpg'; $itrImages = new GlobIterator( IMAGES_PATH . IMAGES_PATTERN ); $itrImages->rewind(); $aImages = []; while ( $itrImages->valid() ) { $splFileInfo = $itrImages->current(); $aImages[$splFileInfo->getCTime()] = [ 'filename' => $splFileInfo->getFileName(), 'filepath' => IMAGES_PATH_NAME . $splFileInfo->getFileName() . '?v=' . microtime( true ), 'filecdate' => date( 'd.m.Y H:i:s', $splFileInfo->getCTime() ) ]; $itrImages->next(); } ksort( $aImages ); $aImagesData = array_values( array_reverse($aImages) ); if ( !isset($_GET['reload']) ) { echo strtr( file_get_contents(__DIR__ . '/webcam.html'), ['{__LAST_IMAGE__}'=>$aImagesData[0]['filepath'], '{__DATETIME__}'=>$aImagesData[0]['filecdate']] ); exit; } echo json_encode( $aImagesData[0] ); ************************************************************************************************************************************** JS window.onload = function() { reload(); } function reload() { var oXmlHttp = new XMLHttpRequest(); oXmlHttp.onreadystatechange = function () { if ( oXmlHttp.readyState !== XMLHttpRequest.DONE ) return; console.log( oXmlHttp.responseText ); setTimeout( reload, 1200 ); _response = JSON.parse( oXmlHttp.responseText ); document.querySelector( '.camview > img' ).setAttribute( 'src', _response.filepath ); document.querySelector( '.camview > img + p' ).innerHTML = _response.filecdate; }; oXmlHttp.open( 'GET', 'webcam.php?reload=1', true ); oXmlHttp.send(); } -
Ich habe den Bildwechsel in meiner Webseite so gelöst,
dann muss man für einen weiteren Bildwechsel keine neue Klasse vergeben:
Code
Alles anzeigenHTML <div class="container"> <img src="images/erich.JPG" alt="Erich" class="image"> <figcaption>Erich Wolf</figcaption> <div class="overlay"> <div><img src="images/erich2.JPG" alt="Erich" class="image"></div> <figcaption>Erich Wolf</figcaption> </div> </div> CSS /* ################################################################ */ /* Fade in Overlay IMG */ /* ################################################################ */ .container { position: relative; width: 50%; } .image { display: block; width: 100%; height: auto; } .overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; opacity: 0; transition: .5s ease; background-color: #008CBA; } .container:hover .overlay { opacity: 1; } -
Damit du über die Möglichkeiten von WP besser informiert bist und dir evtl. schon mal eine Musterseite anlegen kannst, empfehle ich dir dieses Tutorial
-
Aber ich habe jetzt eine Möglichkeit gefunden und eine Lsung gefunden.
Dürfen wir die auch erfahren?
-
Suchen > Ersetzen!?
-
Hallo zusammen,
ich teste gerade wie ich einen Stundenplan responsive gestalten kann und habe dazu die DIV's mit Flexbox gestaltet. Leider funktioniert der Befehl für die Media Queries nicht. Aber warum? Wie kann ich jedem zweiten Child einen farbigen Background geben.
Den Code habe ich beigefügt.
HTML
Alles anzeigenHTML <!DOCTYPE html> <html lang="den"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style.css"> <title>Stundenplan</title> </head> <body> <div class="wrapper"> <div class="flexbox-row"> <div class="flex-item"> <p>Montag</p> </div> <div class=".flex-item:nth-child(1)"> <p>07:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(2)"> <p>08:00 <br> Workout</p> </div> <div class=".flex-item:nth-child(3)"> <p>09:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(4)"> <p>10:00 <br> Workout</p> </div> <div class=".flex-item:nth-child(5)"> <p>11:00 <br> Workout</p> </div> <div class=".flex-item:nth-child(6)"> <p>12:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(7)"> <p>13:00<br> - </p> </div> <div class=".flex-item:nth-child(8)"> <p>14:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(9)"> <p>15:00 <br> Workout</p> </div> <div class=".flex-item:nth-child(10)"> <p>16:00 <br> Workout</p> </div> </div> <div class="flexbox-row"> <div class="flex-item"> <p>Dienstag</p> </div> <div class=".flex-item:nth-child(1)"> <p>07:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(2)"> <p>08:00<br> - </p> </div> <div class=".flex-item:nth-child(3)"> <p>09:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(4)"> <p>10:00 <br> Workout</p> </div> <div class=".flex-item:nth-child(5)"> <p>11:00<br> - </p> </div> <div class=".flex-item:nth-child(6)"> <p>12:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(7)"> <p>13:00<br> - </p> </div> <div class=".flex-item:nth-child(8)"> <p>14:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(9)"> <p>15:00 <br> Workout</p> </div> <div class=".flex-item:nth-child(10)"> <p>16:00 <br> Workout</p> </div> </div> <div class="flexbox-row"> <div class="flex-item"> <p>Mittwoch</p> </div> <div class=".flex-item:nth-child(1)"> <p>07:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(2)"> <p>08:00 <br> Workout</p> </div> <div class=".flex-item:nth-child(3)"> <p>09:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(4)"> <p>10:00 <br> Workout</p> </div> <div class=".flex-item:nth-child(5)"> <p>11:00 <br> Workout</p> </div> <div class=".flex-item:nth-child(6)"> <p>12:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(7)"> <p>13:00<br> - </p> </div> <div class=".flex-item:nth-child(8)"> <p>14:00 <br> Rückenschule</p> </div> <div class=".flex-item:nth-child(9)"> <p>15:00 <br> Workout</p> </div> <div class=".flex-item:nth-child(10)"> <p>16:00 <br> Workout</p> </div> </div> </div> </body> </html> CSS .wrapper{ width:90%; margin: 0 auto; } .flexbox-row { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-around; align-items: flex-start; align-content: center; } .flexbox-item { flex: 0 1 auto; background-color: lightblue; } .flex-item:nth-child(1) { flex-grow: 0; flex-shrink: 1; flex-basis: auto; } .flex-item:nth-child(2) { flex-grow: 0; flex-shrink: 1; flex-basis: auto; } .flex-item:nth-child(3) { flex-grow: 0; flex-shrink: 1; flex-basis: auto; } .flex-item:nth-child(4) { flex-grow: 0; flex-shrink: 1; flex-basis: auto; } .flex-item:nth-child(5) { flex-grow: 0; flex-shrink: 1; flex-basis: auto; } .flex-item:nth-child(6) { flex-grow: 0; flex-shrink: 1; flex-basis: auto; } .flex-item:nth-child(7) { flex-grow: 0; flex-shrink: 1; flex-basis: auto; } .flex-item:nth-child(8) { flex-grow: 0; flex-shrink: 1; flex-basis: auto; } .flex-item:nth-child(9) { flex-grow: 0; flex-shrink: 1; flex-basis: auto; } .flex-item:nth-child(10) { flex-grow: 0; flex-shrink: 1; flex-basis: auto; } /* Media Queries */ @media (max-device-width: 800px) { /* Breite entspricht genau 800 Pixel */ .wrapper{ width: 100%; } .flexbox-row { display: flex; flex-direction: column; padding: 0 2%; } }
