Beiträge von nebbiolo

nebbiolo

SUPER Vielen Dank!

So geht es nun:

// Funktion zur Aktualisierung der Anzeige
schieber.addEventListener('input', function() {
wertAnzeige.textContent = this.value;
document.querySelector('.filmstreifen-schleife').style.animation = `laufschrift ${this.value}s linear infinite`;
});

nebbiolo

Guten Morgen

Der "alte" Mann hat wieder mal ein Problemchen ...

Ich hab e ein JS gefunden, mit dem ich eine Bildlauf (wie Film) abspielen kann - das funktioniert, mit php kann ich über ein Formular mit POST den Wert einsetzen. Nun möchte ich die Geschwindigkeit mit einem JS-Regler einstellen können.

Nun ist mein Problem, wie bringe ich den "slider-wert" in das CSS und aktualisiere es? Geht das überhaupt?

Viele Grüsse aus dem Süden, Nebbiolo

/* Die Box, die alle Bilder enthält und animiert wird */
.filmstreifen-schleife {
display: inline-block;
white-space: nowrap;
animation: laufschrift <?php echo $tempo; ?>s linear infinite;// so geht es mit PHP
?? animation: laufschrift var(--mein-wert)s linear infinite;// so möchte ich es mit JS machen
}

<script>
// Elemente aus dem HTML auswählen
const schieber = document.getElementById('mein-schieber');
const wertAnzeige = document.getElementById('slider-wert');

// Funktion zur Aktualisierung der Anzeige
schieber.addEventListener('input', function() {
wertAnzeige.textContent = this.value;
});

// Auf das Wurzel-Element ((:root)) oder ein spezifisches Element anwenden // der Regler oben funktioniert und der Wert wird verändert aber die Geschwindigkeit ändert sich nicht
document.documentElement.style.setProperty('--mein-wert', slider-wert);
</script>

nebbiolo

Vielen Dank Sempervivium!!!

Gut das der Hauswurz immer lebt ... ich hätte das ja auch wissen sollen, aber ich werde vergesslich

nebbiolo

Hallo zusammen

Ich habe von JS keine Ahnung und bin zu alt um es noch zu lernen ...

Das folgende Script konnte ich mal irgendwo finden und funktioniert bestens.

Nun möchte ich den Wert "var max_size = 350;" variabel vom php übergeben (statt fix 350).

Kann mir jemand helfen wie ich das machen kann?

Vielen Dank im Voraus und Grüsse aus dem Süden, Nebbiolo

<form method="post" action="">
<br>
<input id="inp_img" name="img" type="hidden" value="">
<div style='clear:both;'></div><br>
<input id="bt_save" type="submit" value="Upload">
</form>

<script>
function fileChange(e) {
document.getElementById('inp_img').value = '';
var file = e.target.files[0];
if (file.type == "image/jpeg" || file.type == "image/png") {
var reader = new FileReader();
reader.onload = function(readerEvent) {
var image = new Image();
image.onload = function(imageEvent) {
var max_size = 350;
var w = image.width;
var h = image.height;
if (w > h) { if (w > max_size) { h*=max_size/w; w=max_size; }
} else { if (h > max_size) { w*=max_size/h; h=max_size; } }
var canvas = document.createElement('canvas');
canvas.width = w;
canvas.height = h;
canvas.getContext('2d').drawImage(image, 0, 0, w, h);
if (file.type == "image/jpeg") {
var dataURL = canvas.toDataURL("image/jpeg", 0.5);
} else {
var dataURL = canvas.toDataURL("image/png");
}
document.getElementById('inp_img').value = dataURL;
}
image.src = readerEvent.target.result;
}
reader.readAsDataURL(file);
} else {
document.getElementById('inp_file').value = '';
alert('Bitte wählen Sie ein Bild im JPG- oder PNG-Format aus.');
}
}
document.getElementById('inp_file').addEventListener('change', fileChange, false);
</script>

nebbiolo

Vielen Dank Andreas!

Es sind natürlich viel mehr "buttons" ... nicht nur die Trennline.

Ich habe die Informationen unter folgendem Link gefunden:

https://developer.mozilla.org/en-US/docs/Web…ent/execCommand

OK, dann verwende ich es mal so wie es ist (es funktioniert ja) bis es mal "abgeschaltet" wird

Code

<button type="button" onclick="format('bold','');"><b>B</b></button>
<button type="button" onclick="format('italic','');"><i>I</i></button>
<button type="button" onclick="format('subscript','');">
        <span style="font-size: 65%;"><sub>X</sub></span></button>
<button type="button" onclick="format('superscript','');">
        <span style="font-size: 65%;"><sup>X</sup></span></button>
etc.

nebbiolo

Hallo

Ich habe ein Script für einen Editor, da wird folgendes verwendet:

Code

<button type="button" onclick="format('inserthorizontalrule','');" 
        title="Trennlinie">&mdash;</button>

und einige button mehr ...
diese wird mit folgender Funktion bearbetet:

function format(command_name, command_value) {
   document.execCommand(command_name, false, command_value);
}

Nun habe ich gelesen dass dieser Befehl veraltet sei und durch "designMode" ersetzt werden sollte. Aber als js-Laie (kann gerade so ein wenig php) komme ich da nicht weiter ...

Ich habe ua. mit document.exedesignMode versucht - erfolglos. Kann mir vielleicht jemand angeben wie der Befehl lauten soll?

Viele Grüsse und einen guten Start ins 2021 - und bleibt gesund!

Beiträge von nebbiolo

Animation

Animation

Variable Konstante übergeben

Variable Konstante übergeben

Veralteter Befehl Document.execCommand()

Veralteter Befehl Document.execCommand()

Nun habe ich gelesen dass dieser Befehl veraltet sei und durch "designMode" ersetzt werden sollte. Aber als js-Laie (kann gerade so ein wenig php) komme ich da nicht weiter ...