Beiträge von Kickflip

  • Bootstrap jumbotron: Text vertikal und horizontal zentrieren

    Hi,


    ich möchte meinen Text vertikal und horizontal in einem Jumbotron zentrieren. Ich habe es bislang so:


    Code
    1. <div class="jumbotron jumbotron-fluid">
    2. <div class="container">
    3. <span class="display-5 align-self-center">Text in der Mitte.</span>
    4. </div>
    5. </div>


    Code
    1. .jumbotron {
    2. background-image: url("images/baum.jpg");
    3. background-size: cover;
    4. height: 100vh;
    5. color: white;
    6. }


    Ist bestimmt einfacher als gedacht, aber irgendwie bekomme ich es Immer nur horizontal hin, aber nicht vertikal.


    LG und danke

  • Welches JS Framework für Webseiten?

    ich backe erstmal kleine Brötchen und schaue mal, was sich alles mit jQuery machen lässt.

    User interface würde ich schon irgendwann auch in js können. Habe das immer bislang direkt aus Django oder Flask heraus gebaut. Sieht nur nicht so schön aus. ^^


    Danke für die Hilfe :thumbup:

  • Bootstrap 5 - Carousel startet nicht

    Ich verwende das Standard-Bootstrap. Also bezahle nichts.


    Selbst das Standardbeispiel von der Website bewegt sich nicht. Alles wird korrekt angezeigt, aber es bewegt sich nicht und ich kann auch nicht auf den "Weiter-Pfeil" für das nächste Bild klicken.

  • Bootstrap 5 - Carousel startet nicht

    Hi,

    mein Carousel startet nicht.

    Sieht jemand, warum das so ist? Meine Navbar funktioniert auch einwandfrei mit allen Animationen.


    Benutze Bootstrap 5.


    edit: bootstrap.js wird auch geladen laut Konsole.




    Danke und schöne Weihnachten :saint:

  • Welches JS Framework für Webseiten?

    Hi,


    welches Javascript-Framework würdet ihr mir empfehlen, um damit ein paar Webseiten zu animieren etc.? Das normale JavaScript oder doch Angular, React oder Vue?

    jQuery soll ja ausgedient haben lese ich gerade.


    Also ich bin recht fit in Python und hatte noch keinen großen Kontakt mit Javascript.


    Danke für die Hilfe :thumbup:

  • typed.js funktioniert nicht

    Tatsächlich.


    Da sind ein Fehler mit der typed.js


    Zitat

    [Error] SyntaxError: Unexpected token '{'. import call expects exactly one argument.

    (anonyme Funktion) (typed.js:1)

    --> genauer im typed.js direkt in Zeile 1: import { initializer } from



    und demnach findet er Typed nicht im js:

    Zitat

    [Error] ReferenceError: Can't find variable: Typed

    Globaler Code (127.0.0.1:41)


    Kann damit jemand etwas anfangen? :)

  • typed.js funktioniert nicht

    Danke für deine Antwort. Leider funktioniert das auch nicht. Es wird mir einfach nur der Volltext angezeigt.


    Typed.js habe ich heruntergeladen und die typed.js im Ordner src in den Ordner "static" gepackt. Ich bin echt am verzweifeln...

  • typed.js funktioniert nicht

    Hi,


    ich verzweifle, weil typed.js einfach einen Text nicht animiert tippt und ich nicht verstehe warum.



    javascript.js:

    Code
    1. $(document).ready(function(){
    3. $('#icon').click(function(){
    4. $('ul').toggleClass('show');
    5. $("i", this).toggleClass("fas fa-times fas fa-bar");
    6. });
    7. });



    Die javascript.js funktioniert.


    Warum wird der Text nicht animiert? Hat das was mit jQuery zu tun? Der Text wird angezeigt, aber es wird nichts animiert...



    LG und Danke

  • Einfaches Div mit zwei Sätzen immer mittig auf der Seite anzeigen lassen?

    Code
    1. <div class="titletext">
    2. <a class="titletext01"> Das ist der obere Satz.</a>
    3. <br>
    4. <a class="titletext02"> Das soll direkt darunter stehen</a>
    5. </div>


    Wie sähe das CSS aus, wenn ich einfach den div.titletext immer mittig auf der Seite anzeigen wollte?


    Code
    1. div.titletext{
    2. font-size: 4em;
    3.     (...)
    4. }


    Die beiden Sätze sollen mittig auf der Seite und linksbündig dargestellt werden.


    Hat jemand eine Antwort?


    LG und Danke :)

  • CSS Grid - Images mit Text und Zoom bei hover

    Ich habe die Lösung für das, was ich haben möchte. Ist ein bisschen gefrickelt, aber es funktioniert:


    HTML:

    Code
    1. <div id="dasTeamContainer">
    2. <a href="team.html">
    3. <figure id="grid-item-team">
    4. <img id="dasTeamBild" src="images/team.jpg" alt="alternativer_text">
    5. figcaption id="dasTeam"> Das Team</figcaption>
    6. </figure>
    7. </a>
    8. </div>


    CSS:



    Das einzige, was noch ein bisschen stört sind die height: 57% für die figcaption, damit sie mittig auf dem Bild angezeigt wird. Das ist ein bisschen sehr hardcoded.


    Credits gehen raus an: Sempervivum

  • CSS Grid - Images mit Text und Zoom bei hover

    So war das doch gar nicht gemeint. :) Ich habe ALLE deine Hinweise eingearbeitet und waren auch sehr hilfreich, aber haben nicht direkt zum Ziel geführt. Sitze bestimmt schon 15 Stunden an diesem Problem und habe so ziemlich alle Foreneinträge im Internet gelesen und komme einfach nicht auf einen grünen Zweig, weil immer irgendwas nicht passt oder nicht umsetzbar ist.

  • CSS Grid - Images mit Text und Zoom bei hover

    Sempervivum schrieb:

    Wenn Du nichts von dem umsetzt, was ich dir bisher geschrieben habe, kann es auch nicht funktionieren. :-(

    Doch, das habe ich, aber das sieht dann am Ende noch wilder aus :D


    Border um den Text in der Mitte des Bildes oder das Bild ragt aus der bestimmten Grid-Area heraus u.s.w.


    Dachte das neu dazukommende das Problem so besser einordnen können.