Zusätzliche Funktionen Fallblatt

magic123

Grünschnabel
Hintergrundidee ist eine Fallblattanzeige. Ich möchte gerne, dass der User einer Website einen Kommentar abgeben kann:

DAS XXXX IN XXXXXXX IST

AWESOME_AMAZING_SPECTACULAR

Die Eingabe soll über ein Feld erfolgen, dann soll der Text aber nicht sofort sichbar sein, sondern wie bei einer alten Flughafenfallblattanzeige sich erst Buchstabe für Buchstabe aufbauen.
Ich habe so Verschiedenes gefunden und für mich verändert.

Was ich noch nicht hinbekomme ist ein stylesheet für den Kommentar hinzubekommen. (den ich als var= GUID bezeichnet habe). Auch sollte der Text möglichst unter einem Bild (bereits eingebaut) auf der Seite zu sehen sein.

Ich habe erstmal ein Eingabefeld über PHP realisiert, damit etwas sichtbar ist. Aber ich glaube damit komme ich nicht weiter.


Ich habe vor 15 Jahren eine Ausbildung als Medieninformatikerin gemacht und versuche gerade etwas davon wiederzubeleben. Das macht total Spaß und die Youtube Tutorials sind da auch hilfreich. Dann werde mich auch wieder mit MYSQl beschäftigen

Habt Ihr ein paar Tips für mich ? Ich bin gerade in einem Wettbewerb und möchte vielleicht nicht nur das Konzept dazu beitragen. Sollte ich mich mit Bootstrap beschäftigen ?
CU Anja


<!doctype html>
<html lang=en">
<head>
<title>Fallblattanzeige</title>
<link rel="stylesheet" type="text/css" hrref="css.css"/>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
var fertig = new Array();
function umstellen (zeile,isttext,auftext){
var ist=isttext.split("");
var soll=auftext.split("");
var sindkorrekt=0;
var buchstabe="";
var gesamt="";
var count=0;

do {
sindKorrekt = 1;//Annahme: Alle Stellen sind korrekt
for(var i = 0;i<35;i++){//i ist die Stelle
if(ist!=soll){
buchstabe=umblaettern(ist);
ist=buchstabe;
gesamt+=buchstabe;
sindKorrekt = 0;//Die Annahme war falsch
}else{
buchstabe=ist;
gesamt+=buchstabe;
ist=buchstabe;
}
}
fertig[count]=gesamt;
//alert (fertig[count]+count);
gesamt="";
count++;
}while (sindKorrekt==0);
}
//Funktioniert
var GUID;
var GUID="AWESOME_AMAZING_SPECTACULAR"
//Funktioniert nicht:
function changecolor(){
var el = getElementID("GUID");
$( el ).css( "color", "black" );
$( el ).css( "background-color", "red" );
}

function umblaettern(zeichen){
var buchstabe="";
var ziffer=0;
var gefunden=0;
var zeichensatz = new Array(" ","A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z","0","1","2","3","4","5","6","7","8","9",".",",","&","!","?","-","_",")",":","Ü","Ä","Ö","ß"," ");
for(var i = 0;i<zeichensatz.length;i++){
if(zeichen==zeichensatz){
ziffer=i;
gefunden=1;
break;
}
}
if(gefunden==0){
//alert ("Zeichen wurde nicht gefunden");
}
ziffer++;
buchstabe=zeichensatz[ziffer];
return buchstabe;
}
function changecolor(){
var el = getElementID("GUID");
$( el ).css( "color", "black" );
$( el ).css( "background-color", "red" );
}
window.setTimeout('umstellen (1,"DAS XXXX IN XXXX IST", GUID )',1000);
//Ausgabe
$(document).ready(function() {
});
var zaehler=0;
function partb(){
$('div').html(fertig[zaehler]);
//document.getElementById("eins").innerHTML=fertig[zaehler];
zaehler++;
window.setTimeout ("partb()",200);
}
partb();


</script>
</head>
<body style=" background-position-x:20px;
//background-position-y:20px;
//background-repeat:no-repeat; "
background="testbild.jpeg.jpg">>
<div id="eins"><font size="20"><p style="text-align:center"><p Style="color:blue">DAS XXXX IN XXXX IST</font></p></p></div>
<form action="formular.php" method="post" id="eindeutig_id">
<input type="text" name="GUID">
<input type="submit" value="absenden">
</form>

</body>
</html>
 

magic123

Grünschnabel
Okay. Thx for your infos.

Unfortunatly I'm running out of time. I need this for my pitch.

Could you help me with my code ? How can I change the Style , Color and Size for the var GUID with Flexbox or Grid ?

Is there an easy way to implement also a comment in an user field with button (that would be for var GUID="AWESOME_AMAZING_SPECTACULAR").

That would be really nice :)