Beiträge von Lupus_III

Lupus_III · 27. August 2023

Das war es! Vielen Dank!.

Lupus_III · 27. August 2023

Hallo zusammen, was mache ich falsch? Es werden immer nur die 2. Boxen angezeigt. Ich bin ratlos.

HTML

<!DOCTYPE html>
<html lang="de">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="style.css">
        <title>Animate on Scroll</title>
    </head>
    <body>
        <h1>Animate on Scroll</h1>
        <br><br>
        <div class="box box-show"><h2>HTML</h2></div>
        <div class="box box-show"><h2>CSS</h2></div>
        <div class="box box-show"><h2>Java</h2></div>
        <div class="box box-show"><h2>JQery</h2></div>
        <div class="box"><h2>Responsive</h2></div>
        <div class="box"><h2>SEO</h2></div>
        <div class="box"><h2>Wordpress</h2></div>
        <div class="box"><h2>Support</h2></div>
        <div class="box"><h2>Res. Support</h2></div>
        <div class="box"><h2>About</h2></div>
        <div class="box"><h2>Mobile</h2></div>
        <div class="box"><h2>Content</h2></div>

       <script>
            const boxes  = document.querySelectorAll('.box')
            window.addEventListener('scroll', checkBoxes)
            checkBoxes()

            function checkBoxes(){
                const triggerBottom = window.innerHeight / 6 * 4
                boxes.forEach(box => {
                    const boxTop = box.getBoundingClientRect().top
                    if(boxTop < triggerBottom){
                        box.classList.add('box-show')
                    } else{
                        box.classList.remove('box-show')
                    }

                })
            }
        </script> 
    </body>
</html>

Alles anzeigen

Code

*{
   box-sizing: border-box; 
}
body{
    font-family: Arial, Helvetica, sans-serif;
    display: flex;
    font-weight: 300;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0;
    overflow-x: hidden;
}
h1{
    margin: 10px;
}
.box{
    background-color: #fff;
    border: 2px solid #3b3b3b;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 400px;
    height: 200px;
    margin: 10px;
    border-radius: 10px;
    box-shadow: rgba(0,0,00.2) 0px 60px 40px -7px;
    transform: translateX(400%);
    transition: transform 0.4s ease;
}
.box:nth-of-type(even){
    transform: translateX(-400%);
}
.box-show{
    transform: translateX(0);
}
.box h2{
    font-size: 22px;
    font-weight: 400;
}

Alles anzeigen

Lupus_III · 15. August 2023

Zitat von Sempervivum
Für dich selber kannst Du problemlos ein Neuladen der Seite am Cache vorbei durch Strg+F5 erzwingen. Bei der Entwicklung reicht das normaler Weise aus.
Wenn Du auch für die Besucher sicher stellen willst, dass sie die neueste Version laden, kannst Du z. B. eine Versionsnummer an die URL hängen, so:
Code
<link rel="stylesheet" href="css/select2.css?version=3">
<script src="js/select2.js?version=4"></script>
Und wenn Du dich in Javascript bewegst und z. B. fetch benutzt, geht das automatisch wenn Du einen Zeitstempel benutzt:
Code
fetch('die-url.php?time=' + Date.now(), {
    // hier ggf. die Optionen
}).then
Gerade hier hat mich der Cache, ebenso wie bei dir, früher zur Verzweiflung gebracht, weil ich über Stunden Fehler im Skript gesucht habe und es lag nur am Cache.

Danke, das werde ich mal ausprobieren. Ich suche manchmal lange nach einem Fehler und stelle dann fest, es liegt am Browsercache!!!!

Lupus_III · 14. August 2023

Hallo zusammen,

ich nutze Google Chrome. Wenn ich geänderte Webseiten auf den Webspace hochlade, sehe ich lange Zeit keine Veränderungen. Selbst dann nicht, wenn ich den Refreshbutton mehrfach drücke. Aus verschiedenen Gründen, z. Bsp. weil ich mich nicht ständig in Foren neu anmelden möchte, kommt ein Löschen des Cache nur als Notlösung in Frage.

Hat jemand eine Idee, wie man das hinkriegen kann?

Lupus_III · 4. August 2023

Hallo zusammen,

für einen Betrieb mit etwa 20 Mitarbeitern, die teilweise stationär und teilweise ambulant arbeiten suche ich eine Software zur felxiblen Zeiterfassung per Smartphone, Tablet oder PC.

Das Tool sollte ermöglichen, dass die Mitarbeiter Ihre Arbeitszeit, Pausen und Urlaubszeiten per App erfassen können und alle Meldungen für den Personalsachbearbeiter (Lohnbuchhaltung) in einem Dashboard zusammengefasst werden.

Bei meine Recherchen im www bin ich auf die folgenden Produkte gestossen. Crewmeister, Craftnote, Clocking, Clickup, Hubstaff, Jibble, My Hours, Toggl Track.

Die Lizenz sollte für das kleine Unternehmen monatlich nicht mehr als 50€ kosten.

Kann jemand aus seiner Arbeitspraxis mir ein Tool vorschlagen, das diese Punkte im Wesentlichen erfüllt.

Lupus_III · 22. Juli 2023

Ich würde die Frage mal in diesem Forum absetzen => WP Forum Ich glaube da hast du mehr Glück.

Und auf die Schnelle habe ich noch das gefunden => Translate für WP

Lies dich mal ein, ob das eine Option für dich ist

Lupus_III · 9. Juli 2023

Vielen Dank, Leute, das war die Lösung. Manchmal sieht man den Wald vor Bäumen nicht!

Lupus_III · 9. Juli 2023

Hallo zusammen,

ich nutze in einer Webseite dieses Formular - https://www.reha-sportstudio.de/202301_aktion.php . Bei meinen Tests mit verschiedenen Browsern wird rechts neben den Inputfeldern ein ordentlicher Abstand angezeigt. Leider funktioniert das nicht auf meinen Smartphones Samsung Galaxy S 21 und S7, wie der beigefügt Screenshot zeigt.

Hat jemand eine Ahnung an was das liegen kann?

Lupus_III · 8. Juli 2023

@nextuser-. Nur zu meinem Verständnis.

section>p:not(:last-of-type) {margin-bottom: 2rem;} - Soll das letzte p-Tag keinen 2rem Abstand nach unten haben, die anderen aber schon?

Lupus_III · 22. Juni 2023

Mir gefällt die Seite!

Lupus_III · 22. Juni 2023

Zitat von Emess

[…]

Lieber Emess, ich weiß zwar nicht wie alt du bist, aber ich gehe auf die 75 zu und habe mich die letzten Jahre in die Materie eingearbeitet. Alter ist doch kein Hinderungsgrund sich neuem zuzuwenden, zumal man keine körperliche Fitness dafür braucht, sondern ein funktionsfähiges Gehirn. Ich habe zum Beispiel mit der Einarbeitung in das HTML-Seminar - https://www.html-seminar.de/ - begonnen und dann kontinuierlich weiter, auch mit Fachliteratur, gelernt. Jeden Tag ein paar Stunden. Das hält geistig frisch, auch im hohen Alter, und macht Spass. Und wenn man an einer Stelle hängt und nicht weiter weiß, hilft Dir das Forum. Also, ran an den Speck!

Lupus_III · 13. April 2023

Ich beschäftige mich gerade mit Bootstrap. Wie ist das wenn Bootstrap auf eine neue Version upgedatet wird? Muss man dann seinen HTML-Code anpassen. Hat da jemand Erfahrung?

Lupus_III · 21. März 2023

Zitat von nextuser

Hi Lupus,

wie hast du es jetzt gemacht?

Da ich nur drei Icons brauchte, habe ich die Ordner css mit der Datei all.css und den Ordner webfonts auf den Webserver geladen. Das hat für meine Bedürfnisse gereicht und Speicherplatz gespart. Der Link in den HTML-Dateien sieht dann so aus => <link rel="stylesheet" href="fontawesome-free-6.2.1-web/css/all.css">

Dazu gibt es in youtube auch einen Beitrag =>

Externer Inhalt youtu.be

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Durch die Aktivierung der externen Inhalte erklären Sie sich damit einverstanden, dass personenbezogene Daten an Drittplattformen übermittelt werden. Mehr Informationen dazu haben wir in unserer Datenschutzerklärung zur Verfügung gestellt.

Lupus_III · 21. März 2023

Bei Deiner Antwort viel mit der Witz ein, als sich zwei in einem Fesselballon verflogen haben und aus zehn Meter Höhe einem Bauer zuriefen "Wo sind wir?! und zur Antwort bekamen " in einem Fesselballon"!

Lupus_III · 20. März 2023

Ich hätte lieber gleich bei youtube anfragen sollen. Dann wäre mir dieser Umweg erspart geblieben. Lesson to learn.

Lupus_III · 19. März 2023

Das war jetzt mal wieder eine Antwort mit der niemand was anfangen kann. Vielleicht war meine Frage auch zu weit gefasst. Also nochmal, wenn ich aus dem Fontawesome Paket 3 Icons für meine Webseite brauche. Zum Beispiel Facebook, Instagram und fa-chevron-up, welche Dateien soll/ kann ich dann auf den Webspace übertragen?

pasted-from-clipboard.png

Lupus_III · 17. März 2023

Hallo zusammen,

seit der Diskussion über die Abmahnungen für die Verwendung von Google-Fonts verwende und speichere ich auch die Datei fontawesome-free-6.2.1-web local auf dem Webserver und verknüpfe meine HTML-Dateien mit dieser Datei mit dem Link <link rel="stylesheet" href="fontawesome-free-6.2.1-web/css/all.min.css">.

Die Datei fontawesome-free-6.2.1-web ist ca. 26MB groß. Frage: ist es erforderlich, das ganze Paket auf den Webserver zu laden, oder kann man da auch selektiv vorgehen? Wie macht Ihr das in der Praxis?

Lupus_III · 12. März 2023

Ich bin auch wieder dabei und freue mich, dass das Forum wieder weiterlebt. Auf interessante Beiträge bin ich gespannt. Danke an alle, die das ermöglicht haben.

Gruß Erich

Lupus_III · 21. Januar 2022

Hallo Leute,

in der folgenden Webseite gibt es im Headerbereich (Navigation) und in der Webseite abgeschrägte Container. Kann man diese Funktionalität mit CSS steuern und wenn ja wie?

Hier der Link => https://phc-muenchen.de/

Lupus_III · 13. Januar 2022

Zitat von m.scatello

Lupus_III
Wenn in der Datei nur HTML-Code steht, was ja hier zu vermuten ist, dann ist readfile die bessere Alternative, weil dann die Datei nicht auch noch durch den Parser gejagt wird.

Da hast Du Recht. Das steht auch in der von mir zitierten Webseite von w3schools so.

Beiträge von Lupus_III

Bewegtes scrollen

Bewegtes scrollen

Browsercache bringt mich zur Verzweiflung

Browsercache bringt mich zur Verzweiflung

Software für Zeiterfassung von Mitarbeitern

Ich brauchte eine Lösung, um meine WordPress-Anwendung mehrsprachig zu machen

Formularfelder sind auf kleinen Displays zu breit

Formularfelder sind auf kleinen Displays zu breit

[gelöst] Tabelle mittig ausrichten. Nicht si trivial wie gedacht

Feedback zu meiner Seite

Versuch Bootsrap zu verstehen, um nach und nach ein eigens Template zu bauen.

Bootstrap Update

fontawesome local speichern

fontawesome local speichern

fontawesome local speichern

fontawesome local speichern

fontawesome local speichern

Schön, dass dieses Forum weiterlebt...

Abgeschrägtes Header Div

Navigationsleiste auf allen Einzel-Seiten, grundsätzliche Vorgehensweise bei Erstellung und Pflege ?