|
Anzeige
|
HTML-Element schreibbar machen
Gast
#3865794
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?
-------- |Inhalt| -------- Danach z.B. -------- |Hallo!| --------
Gast
#3865797
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
Gast
#3865805
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>
Gast
#3865814
Ist es genauso einfach, einen div per Knopfdruck oder per Mausbewegung zu drehen?
Gast
#3866390
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.
Gast
#3866424
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
Gast
#3866458
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
Gast
#3866526
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.
Antwort schreiben |
Anzeige
|
