Wie beut man ein kleines Modalfenster

    Guten Abend,

    ich habe von JS wenig Ahnung, leider auch nciht die Zeit, mich da groß reinzuarbeiten. Fertigen Code verstehe ich aber und kann ich - wenn auch mühsam - anmeine Zwecke anpassen.


    Ich bin jetzt auf der Suche nach einem kleinen Modal/Fensterchen, dass auf dem Bildschirm immer rechts oben eingeblendet wird, egal wohin man auf der Seite scrollt. Hintergrund ist folgender: Ich habe für meine Internetseiten in PHP einen Quiz programmiert. Dieser ist zeitlimitiert. Zu Beginn und am Ende wird über


    Code
    <span id="timer_lek_beginn"></span>

    die Restzeit angezeigt. Je weiter sie runterläuft, desto mehr verfärbt sich der CountDown-Timer von grün nach rot. Gesteuert wird das durch ein JS. Das klappt auch alles soweit.


    Dieser Timer, der bisher vor der ersten und nach der letzten Frage steht, soll jetzt in ein kleines Modal und immer sichtbar sein. Hat da jemand eine (fast) fertige Lösung, die ich an meine Bedürfnisse anpassen kann?


    Vielen Dank!


    AS

    Das ist zunächst mal recht einfach, mit diesem CSS kannst Du den Timer rechts oben anheften:

    Code
            #timer_lek_beginn {
            display: inline-Block;
            position: fixed;
            right: 0;
            top: 0;
            padding: 1em;
            border: 2px solid lightblue;
        }

    Es gibt da jedoch ein kleines Problem: Der Timer wird dann den Inhalt auf deiner Seite überdecken. Möglicher Weise ist das akzeptabel, weil dieses Fensterchen ja wahrscheinlich recht klein sein wird.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden