HTML-Element schreibbar machen

[Webseiten-Programmierer (Gast)]

Hallo,

ich möchte für ein Projekt eine HTML-Element (nicht <input> oder 
<textarea>) schreibbar machen d.h. man macht einen dblclick auf das 
Element und man soll den Text-Inhalt bearbeiten können. Nach einem Klick 
neben das Element soll der neue Text darin bleiben. Wie geht das?

<div style="border:1px solid black;">Inhalt</div>

--------
|Inhalt|
--------

Danach z.B.

--------
|Hallo!|
--------

[Test (Gast)]

mit HTML5 über das "contenteditable" attribut und ein wenig javascript 
wenn es unbedingt mit extra click sein muss

http://www.w3schools.com/tags/att_global_contenteditable.asp

[Webseiten-Programmierer (Gast)]

Mit javascript ist es dann einfach umsetzbar z.B. in dem man dem div 
eine id gibt und dann mit 
getElementById('id').style.contenteditable=true es umstellt. Noch 
einfacher ist es mit:
<div ondblclick="this.style.contenteditable=true;">Inhalt</div>

[Webseiten-Programmierer (Gast)]

Ist es genauso einfach, einen div per Knopfdruck oder per Mausbewegung 
zu drehen?

[Webseiten-Programmierer (Gast)]

Ich glaube, um dies zu verstehen, mus ich den ganzen Code zeigen.

Bei Click auf einen der A's wird ein div geschrieben. Bei dblclick 
verändert sich die opacity auf 0. Im div ist ein Element schreibbar und 
ein Bild vorhanden. Bei Click auf den div mit drehen soll sich der ganze 
Außen-div mit den Innen-divs drehen. Die Funktion startDrag() ist für 
das verschieben mit der Maus zuständig.

[Webseiten-Programmierer (Gast)]

Habe gerade noch einen Link gefunden, mit dem das machen kann, 
allerdings kann dabei nur ein besteimmter div gedreht werden. Vielleicht 
ist das trotzdem beim bauen hilfreich.

https://community.contao.org/de/showthread.php?46255-Jquery-zum-Drehen-eines-Divs

[Webseiten-Programmierer (Gast)]

document.getElementById('content').innerHTML+='<div 
onclick=\'javascript:this.style.transform="rotate(15deg);"\'> 
Drehen</div>';

geht leider nicht. Ich weiß aber nicht warum. Jetzt fällt mir nichts 
mehr ein, woran es liegen könnte. Ich teste es mal mit JQuery unter 
https://community.contao.org/de/showthread.php?46255-Jquery-zum-Drehen-eines-Divs

[Webseiten-Programmierer (Gast)]

function fuegehinzu(text,beschreibung){
 document.getElementById("content").innerHTML+='<div 
style="position:absolute; max-width:200px; max-height:200px; 
padding:7px; top:300 px; left:100px;" onclick=\'var element = 
this;element.classList.add("gedreht");\'ondblclick="this.style.opacity=0 
;"  onmousedown="startDrag(this);"><img alt="'+beschreibung+'" 
src="'+text+'"/><div contenteditable="true">'+beschreibung+' 
</div><div>Drehen</div></div>';
}

Die Lösung! Jetzt wir bei click auf das ganze Element gedreht. Es soll 
aber, wenn auf drehen geclickt wird, das Element gedreht werden.