Beiträge von Sempervivum

$('[name="ww"]').html('<p>hallo</p>');

Ja, das ist richtig.

Zitat

was mache ich den wenn ich 2 mal oder mehrmal den gleichen namen habe??

In diesem Fall genau so. jQuery legt automatisch eine Schleife an und führt die Aktion, in diesem Fall das HTML setzen, für alle Element durch, auf die der Selektor passt. Beachte jedoch, dass das nur bei Radiobuttons sinnvoll ist oder wenn man ein Array von Formularelementen anlegt. Sonst kann man die Elemente nicht unterscheiden, analog zu mehrfachen IDs.

Edit: Oder möchtest Du ein einzelnes Element aus dem Set ansprechen? Dann geht es mit eq():

$('[name="ww"]')eq(1).html('<p>hallo</p>');

Ja, damit bin ich auch schon konfroniert worden. Der Grund ist, dass Javascript die Funktion im globalen Skope sucht, wenn sie in dieser Form inline notiert wird. Bei jsfiddle ist sie jedoch in einer Funktion gekapselt, z. B. im onload-Event, je nach Einstellung, so dass sie im globalen Scope nicht sichtbar ist. Abhilfe, indem der Listener nicht inline sondern mit addEventListener() oder äquivalent bei jQuery registriert wird.

das ein Computer mehrere millionen rechnungen die Sekunde macht?

Das bezieht sich auf Machinenbefehle. Wenn Du eine Befehlszeile in einer Hochsprache siehst, muss die geparst und in Maschinenbefehle umgesetzt werden. Und dabei können sehr viel mehr Befehle heraus kommen. Vor allem das Parsing von HTML ist aufwändig, siehe hier:

http://www.webdeveloper.com/forum/showthre…-way-to-do-this

aber das ist bei dem Problem in diesem Thread wohl weniger relevant.

scss ist ebenfalls ein Precompiler und das CSS muss kompiliert werden. Ich habe um diese ganzen Precompiler bisher einen Bogen gemacht. Sie haben insofern eine Berechtigung, weil die Möglichkeiten von CSS sehr begrenzt sind, es gibt z. B. keine Variablen, keine Funktionen und Rechenoperationen nur in sehr eingeschränkter Form (calc).

Nein, nicht beim Fiddle sondern bei Codepen im CSS-Fenster. Ich habe es getestet und mit dem kompilierten CSS läuft auch das Fiddle.

Zitat

ich weiss sowieso nicht wie das geht,kann mir dabei einer helfen.

Lies zunächst mal die Beschreibung bei Selfhtml und wenn Du dann noch Fragen hast, melde dich wieder.

https://wiki.selfhtml.org/wiki/JavaScript/Web_Storage

Das CSS in dem Codepen verwendet Less und muss kompiliert werden. Wähle in dem Auswahlmenü rechts oben im CSS-Fenster "View compiled CSS" dann wird das CSS kompiliert und Du kannst es verwenden.

Dazu musst Du den Zustand im Local- oder Sessionstorage speichern und beim Laden wieder einlesen.

Bei Checkboxes ist es relativ einfach, wenn man den Checkbox-Hack anwendet: Einer Checkbox kann man ein Label zuordnen. Die Checkbox wird unsichtbar gemacht. Klick auf das Label steuert den Zustand der Checkbox. Zustand der Checkbox steuert das Aussehen des Labels.

https://jsfiddle.net/Sempervivum/3dyrdo07/1/

Bei Selects ist es leider nicht so einfach. Hier ist es eher empfehlenswert, ein Select mit CSS und Javascript neu zu bauen. jQuery-UI hat z. B. so etwas:

https://jqueryui.com/selectmenu/

Anscheinend sind es die String-Operationen, die ihn umbringen, denn ohne die geht es relativ schnell:

<script>
        var siz = 0;
        var data = [];
        var insane = "";
        for(var i = 0; i < 255; i++) {
            for(var i2 = 0; i2 < 255; i2++) {
                for(var i3 = 0; i3 < 255; i3++) {
                    siz = siz + 1;
                    data.push(i);
                    data.push(i2);
                    data.push(i3);
                    data.push(255);
                    //insane += i + " - " + i2 + " - " + i3 + " - " + 255;
                }
            }
        }
        console.log(siz);
        //$("form#main").empty();
        //$("form#main").append("<p>" + data + "</p>");
    </script>

Was ist denn überhaupt der Sinn der Sache? So etwas kann doch kein Mensch lesen.

Auf der Suche nach der richtigen Formel bin ich auf dieses gestoßen:

http://ge-waldbroel.nw.lo-net2.de/jenders/publik…eier_Fall1.html

Mit einen Demo in Javascript.

Das wird dir wahrscheinlich auch kein besseres Ergebnis bringen als mit der jetzigen Animation. Das Problem ist, dass die Seite, wo es eingebettet ist, nicht wirklich responsiv ist:

Zitat

dass die umgebenden Container nicht der Größe des Browserfensters folgen. Deshalb ändert sich die Größe der Animation nicht, denn sie folgt mit einer Breitenangabe von 100% dem umgebenden Container.

Ach so, dann ist es sehr einfach: Du brauchst dem Alert nur ein overflow:hidden zu geben, dann wird der Tropfen außerhalb unsichtbar.

Ah so, jetzt verstehe ich, glaube ich. Du möchtest, dass der Tropfen hinter dem Alert herunter fällt, d. h. er soll vom ganzen Alert verdeckt werden?

Zitat

das er hinter den roten verschwindet und dann weg ist und nicht unter den roten wieder raus kommt.man könnte ober und unterhalbdes alerts ja noch ein div bauen wo der tropfen hinter verschwindet.

Kein Problem, ich hoffe, ich habe dich richtig verstanden:

<div id="alert">
        <div id="kopf">Das ist ein Alert</div>
        <div id="kreis"></div>
        <div id="filler1"></div>
        <div id="inhalt">Dies ist der Inhalt</div>
        <div id="filler2">
            <button id="close">Schliessen</button>
        </div>
        <img id="drop" src="https://www.mediaevent.de/javascript/img/drop.png">
    </div>
    <style>
        #alert {
            display: flex;
            flex-direction: column;
            align-items: center;
            position: relative;
            width: 50%;
            margin: auto;
            border: 1px solid black;
            height: 50vh;
            background-color: lightgrey;
        }

            #alert > * {
                position: relative;
            }

        #drop {
            position: absolute;
            left: calc(50% - 54px);
            top: 0;
            animation: drop 4s infinite linear;
        }

        #kopf {
            align-self: stretch;
            background-color: blue;
            color: white;
            padding: 5px;
            text-align: center;
            margin-bottom: auto;
            z-index: 5;
        }

        #kreis {
            width: 100%;
            height: 30%;
            background-color: lightgreen;
            background-image: url(http://www.mediaevent.de/javascript/img/circle.png);
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center center;
        }

        #inhalt {
            align-self: stretch;
            text-align: center;
            background-color: lightsalmon;
            z-index: 5;
        }

        #filler1, #filler2 {
            background-color: lightgrey;
            flex-grow: 1;
            align-self: stretch;
        }

        #filler2 {
            z-index: 5;
            display: flex;
            align-items: flex-end;
            justify-content: center;
        }

        #close {
            margin-top: auto;
        }

        @keyframes drop {
            0% {
                top: -180px;
                opacity: 1;
            }

            90% {
                top: 100%;
                opacity: 1;
            }

            100% {
                top: 100%;
                opacity: 0;
            }
        }
    </style>

Schau mal, ob dir dies weiter hilft:

https://css-tricks.com/drag-and-drop-file-uploading/

Eigentlich um Dateien hochzuladen, ob es mit dem Drag&Drop einer Email aus Outlook funktioniert, weiß ich nicht. Konne es auch nicht testen, weil ich kein Outlook habe. Mit einer eml-Datei funktioniert es jedoch. Musste den Typ für Ajax auf "text" ändern und auf dem Server war der erste Eintrag in $_FILES leer. Ich hänge meine Testdateien mal an, dann kannst Du versuchen, ob es auch mit Drag&Drop aus Outlook funktioniert.

Zitat

heist doch center zwischen oben und unten ,,und center zwischen links und rechts oder??

hatte das schon mal öfters versucht ,hat aber nie wirkung gezeigt,da muss man wohl noch was anderes beachten damit das geht oder wie?.

Genau. Keine Ahnung, warum es bei dir nicht funktioniert hat. Am besten postest Du ein Beispiel, damit man es sich ansehen kann.

Zitat

das er hinter den roten verschwindet und dann weg ist und nicht unter den roten wieder raus kommt.man könnte ober und unterhalbdes alerts ja noch ein div bauen wo der tropfen hinter verschwindet.aber wie ich dich kenne kennst du da bestimmt nee andere lösung.

Ich denke, ein zusätzliches div ist schon der richtige Ansatz. Etwas anderes fällt mir auch nicht ein.

Ich war mir nicht sicher, ob das Flexlayout mit relativer/absoluter Positionierung und z-index zusammen funktioniert, aber ein Versuch zeigt, dass es das problemlos tut:

   <div id="alert">
        <div id="kopf">Das ist ein Alert</div>
        <div id="kreis">
        </div>
        <div id="inhalt">Dies ist der Inhalt</div>
        <button id="close">Schliessen</button>
        <img id="drop" src="https://www.mediaevent.de/javascript/img/drop.png">
    </div>
    <style>
        #alert {
            display: flex;
            flex-direction: column;
            align-items: center;
            position: relative;
            width: 50%;
            margin: auto;
            border: 1px solid black;
            height: 50vh;
            background-color: lightgrey;
        }

            #alert > * {
                position: relative;
            }

        #drop {
            position: absolute;
            left: calc(50% - 54px);
            top: 0;
            animation: drop 4s infinite linear;
        }

        #kopf {
            align-self: stretch;
            background-color: blue;
            color: white;
            padding: 5px;
            text-align: center;
            margin-bottom: auto;
            z-index: 5;
        }

        #kreis {
            width: 100%;
            height: 30%;
            background-color: lightgreen;
            background-image: url(http://www.mediaevent.de/javascript/img/circle.png);
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center center;
        }

        #inhalt {
            align-self: stretch;
            text-align: center;
            background-color: lightsalmon;
            z-index: 5;
        }

        #close {
            margin-top: auto;
        }

        @keyframes drop {
            0% {
                top: -180px;
                opacity: 1;
            }

            90% {
                top: 100%;
                opacity: 1;
            }

            100% {
                top: 100%;
                opacity: 0;
            }
        }
    </style>

Ich habe dies auf einer Testseite entwickelt, damit mir die Features meines Editors zur Verfügung stehen (Validierung etc.).

Ja, ich schrieb ja schon, wenn sich Elemente überdecken sollen, geht es nicht ohne absolute Positionierung. Flexlayout ist dafür gemacht, Elemente anzuordnen, die sich im normalen Fluss befinden. Auch wenn man z-index verwenden will, müssen die Elemente positioniert sein.

Anscheinend hast Du dich nicht über Arrays in Javascript informiert. Ich habe mal versucht, deinen Code, so gut ich ihn verstehe, in Javascript umzusetzen:

        v = [0]; //ein Array mit 0 als erstem Element, index = 0
        a = [9.81]; // ein Array mit 9.81 als erstem Element, index = 0
        y = [1000]; // ein Array mit 1000 als erstem Element, index = 0
        for (i = 1; i <= 1000; i++) {
            v[i] = v[i - 1] + a[i - 1];
            a[i] = 10 - 27 / 65 * v[i] * v[i];
            y[i] = y[i - 1] - v[i];
        }
        console.log(v, a, y);

Allerdings kriege ich die Formel nicht so hin, dass die Ergebnisse plausibel sind. Auch wenn ich Klammern setze:

a[i] = 10 - 27 / (65 * v[i] * v[i]);

wird es anders aber ebenso wenig plausibel. Da ist dann der Physiker gefragt.