Beiträge von Sempervivum

Das Cross-Origin-Problem ist unabhängig davon, ob du eine Bibliothek verwendest oder nicht. Verwende doch einfach ein eigenes Bild, dann stellt sich das Problem nicht.

Wenn man sich den ersten Header ansieht, ist sofort klar, warum: Ich habe den Zugriff nur für fiddle frei gegeben.

Ja, das Bild liegt unter images/bild1.jpg. Du kannst es von dort laden, wirst aber Probleme mit tainted canvas bekommen.

Das Skript, das ich gepostet habe, benutzt jCanvas. Hast Du das auch eingezogen? Die Funktion drawImage gibt es, leider unter dem selben Namen, auch in der normalen API für Canvas, wo sie mindestens drei Parameter benötigt.

Zitat

wenn man die bildadresse so aufrufen tut kommen ja nur komische buchstabden und zeichen raus?

Versuche es jetzt noch Mal. Das ganze ist Neuland für mich und ich hatte den Mime-Type noch nicht angegeben, der dem Browser mitteilt, dass es sich um ein jpeg-Bild handelt.

Das PHP-Skript liest das Bild aus der Datei und gibt es unverändert aus. Hier hat man jedoch die Möglichkeit, einen Header anzugeben, der das Bild für Cross-Origin-Zugriff frei gibt.

<?php
header("Access-Control-Allow-Origin: https://fiddle.jshell.net");
header('Content-Type: image/jpeg');
die(file_get_contents("images/bild1.jpg"));
?>

Das Ganze kann man auch über die .htaccess-Datei erreichen.

Ich schrieb ja, dass es mit PHP Mittel und Wege gibt:

https://jsfiddle.net/Sempervivum/5nt1pgq9/8/

Funktioniert allerdings nicht mit jedem x-beliebigen Bild.

Zitat

Auser wennseite XY selber fremdbilder anzeigt,die solten sich dann wieder nicht auslesen,richtig?

Genau. Und wenn Du es schaffst, das Bild in jsfiddle wirklich auszulesen, bist Du der Held.

Es gibt da Mittel und Wege mit PHP, aber das wird beim fiddle auch nicht helfen, weil man ein PHP-Skript ja dort nicht hosten kann und wenn es woanders liegt, hat man die gleichen Probleme mit Cross-Origin. Es sei denn, man gibt es frei.

Es ist nicht so, dass technisch kein Zugriff auf das Bild möglich ist (wie Du richtig schreibst, ist es ja im Cache und im Speicher), sondern der Browser blockt den Zugriff, sobald man versucht, das Bild auf irgend eine Weise auszulesen. In Cookie oder Local-Storage speichern, geht auch nicht, da man dazu das Bild zunächst auslesen müsste.

Der Zugriff ist nur möglich, wenn das Bild auf der selben Domain liegt wie die HTML-Seite.

Das liegt nicht an jsfiddle sondern ist eine generelles Problem: Der Browser lässt nicht zu dass ein Bild von einer anderen Domain ausgelesen wird. Sieh in die Console, dort wird eine entspr. Fehlermeldung ausgegeben. Stichwort cross-origin-Zugriff.

Ja, mit jCanvas ist der Code sehr kurz, weil man keine Rechnerei mit der Mausposition braucht.

Schau mal, ob dir z. B. dies weiter hilft:

https://www.php-kurs.com/email-per-php.htm

Das Validieren von Email-Adressen ist eine Wissenschaft für sich, wird aber von PHP unterstützt:

http://php.net/manual/de/filter.examples.validation.php

Hallo Basti, mit jCanvas funktioniert es so:

    <canvas width="800" height="600"></canvas>
    <script>
        cv = $("canvas");
        cv.drawImage({
            source: "images/text-color.png",
            layer: true,
            x: 0, y: 0, fromCenter: false,
            mousemove: function (layer) {
                cv.setPixels({
                    x: layer.eventX, y: layer.eventY,
                    width: 1, height: 1,
                    each: function (px) {
                        console.log(px.r, px.g, px.b);
                    }
                });
            }
        });
    </script>

http://ulrichbangert.de/div/webentwick…olorpicker.html

(die Werte werden in der Console ausgegeben)

Leider funktioniert das nicht unter jsfiddle, sieh dir die Console an:
https://jsfiddle.net/Sempervivum/5nt1pgq9/4/

Hallo Basti, etwas komplizierter mit jQuery:

$(".lauf1").html($(".lauf1").html() + "<span style='color:  "+aa+";'>" + text.substring(i,i+1)+"</span>")

Zitat

Was ist den CDN?

Ein bisschen kompliziert, siehe hier:

https://de.wikipedia.org/wiki/Content_Delivery_Network

Das einzige, was man als Anwender wissen muss, ist, dass Skripts bereit gestellt werden, die man direkt einbinden kann, ohne sie herunter laden und selbst hosten zu müssen. Für jsfiddle sehr praktisch.

Zitat

Wenn ich sowas mal auf meine HP laden will muss ich dann die Originalen Scripte nehmen oder auch alles reinkopieren wie in dein Beispiel?

Das reinkopieren sollte man nur als letzten Ausweg verwenden, wenn nichts anderes möglich ist. Auf der eigenen Homepage solltest Du die Dateien hoch laden und einbinden.

Zitat

Mal kucken ob ich die Farben geändert kriege weil finde das so etwas öde,

Da wahrich mal wieder zu voreilig,finde es nicht.Aber ich gebe noch nicht auf

Die Farben kannst Du hiermit ändern:

var el = led1.create(p, '#f00', '#000');

Zitat

create(HTMLElement [, color, backcolor])Erzeugt die Anzeige und fügt sie in das HTML Element ein. Optional kann dort die Farbe angegeben werden

Hast Du dies gelesen?:

Zitat

Folgende Dateien werden benötigt, um einen LED Scrollen einzubinden:

• led.js
• led-panel.js
• led-chars-all.js

In einem Fiddle bindet man normaler Weise die Skripts von einem CDN aus ein, aber ich denke für diese wird es kein CDN geben.

Lösung:

• Die Skripts selber hosten oder
• die Skripts im Javascript-Fenster vollständig einfügen.

Mit letzterem sieht es so aus:

https://jsfiddle.net/Sempervivum/aayaef2h/

Schau mal, ob dies dir hilft:

<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">

(im Head einfügen)

Hallo Rafaela,

freut mich, dass es jetzt funktioniert.

Zitat

Ich habe die" id " Befehle in meiner CSS Datei statt groß klein geschrieben. Es war also nur ein falscher Buchstabe

Leider war davon in dem Code, den Du gepostet hast, nichts zu erkennen, sonst hätte man die gezieltere Hinweise geben können. Ja, Probleme mit Groß- und Kleinschreibung treten häufig auf.

Ich wünsche dir noch einen angenehmen 2. Advent.

In dem Code, den Du gepostet hast, kann ich keinen Fehler entdecken. Heißt deine CSS-Datei wirklich style.css und liegt sie wirklich in dem selben Ordner wie die HTML-Datei?

Doch, das geht mit Javascript, wenn Du HTML5-Canvas verwendest, am besten mit jCanvas. Und wenn es live sein soll, d. h. der Farbcode soll laufend aktualisiert werden, wenn man die Maus bewegt, scheidet PHP aus.

Ah ja, hab's wieder gefunden. Dann lag ich mit meinem Tipp ins Blaue richtig:

Der Code erzeugt jedes Mal ein neues Popup und weil die ID mehrfach vorkommt, wird nur die erste gefunden, aber nicht die von dem, das zuletzt erzeugt wurde.

Lösung: Abfragen, ob das Popup schon existiert, wenn ja, das existierende wieder sichtbar machen. Dies funktioniert bei mir:

        var popupbgid = "lPersonenPopUpHintergrund";
        function PersonenPopUp(Personennamen) {
            var popupid = "PersonenPopUp";

            if (!document.getElementById(popupbgid)) {
                var lPersonenPopUpHintergrund = document.createElement("div");
                lPersonenPopUpHintergrund.id = popupbgid;
                document.body.appendChild(lPersonenPopUpHintergrund);

                var lPersonenPopUp = document.createElement("div");
                lPersonenPopUp.id = popupid;
                lPersonenPopUpHintergrund.appendChild(lPersonenPopUp);

                var content = "";
                for (var i = 0; i < Personennamen.length; i++) {
                    content = content + "</br></br><input type='radio' name='teacher' value=''>" + Personennamen[i];
                }

                lPersonenPopUp.innerHTML = "<form method='post' action='ZeitplanerS.php' >" + content + "</br></br><button onclick='ClosePopUp(\"" + popupid + "\")' type='button' name='submitPersonenPopUp'>" + popupid + "</button></form></br>";
            } else {
                document.getElementById(popupbgid).style.display = "block";
            }
        }

        function ClosePopUp(PopUp) {
            document.getElementById(popupbgid).style.display = 'none';
        }

Wenn Du es online hast, dann poste doch die URL.

Zitat

indem ich mit JS ein neues div Element erstelle

Ins Blaue geraten: Nicht jedes Mal neu erzeugen, sondern immer das selbe sichtbar und unsichtbar machen.

Die Lösung interessiert mich auch, lass mal hören!