TinyMCE Textarea auf transparent setzen
lima-city → Forum → Programmiersprachen → PHP, MySQL & .htaccess
aussehen
bereich
bestehende design
code
editor
eigentliche hintergrundbild
einbinden
hintergrund
hintergrundfarbe
http
jemand
problem
projekt
setzen
test
text
transparenz
tun
url
welt
-
Hallo,
ich versuche in mein derzeitiges PHP-Projekt den Editor tinymce.com einzubauen.
Das Einbauen ist nicht wirklich schwierig.
Das Einbinden soll aber nicht aussehen wie hingeklatscht, sondern soll an das bestehende Design der Seite angepasst werden!
Ich verwende TinyMCE 4.x in der neuesten Version.
Dort wo ich den Text in TinyMCE eingebe (Textarea) will ich den Style anpassen:
Schriftfarbe und Größe kann ich problemlos anpassen.
Die Hintergrundfarbe kann ich auch neu setzen.
Eigentlich will ich aber gar nicht die (Text-) Hintergrundfarbe neu setzen, sondern nur transparent machen!
Dies gelingt mir aber nicht!
Hier ein Beispiel wie es aussehen soll:
http://www.w3schools.com/css/tryit.asp?filename=trycss_transparency
Hat das schon jemand hinbekommen?
Kann mir mal jemand auf die Sprünge helfen?
Danke im voraus.
Gruss Dunkeltuten
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Wie wäre es, wenn du uns mal zeigst, was du bisher probiert hast?
EDIT: Ach so, dachte es gibt ein Problem ...
CSS:
tinymceselector { background: rgba(0,0,0,0.5); }
würde den Hintergrund schwarz mit einer Transparenz von 50% machen. Lies dich einfach in rgba ein.
Wird von allen großen Browsern unterstützt.
Beitrag zuletzt geändert: 24.2.2016 16:41:35 von tchab -
JA, es gibt ein Problem:
Die Transparenz klappt leider nicht
Habe mir das das Problem mal mit Firebug angeschaut:
Offensichtlich wandelt TinyMCE den ursprünglichen Bereich <textarea id="mytextarea"> in einen IFrame. Dieser Iframe hat die Hintergrundfarbe weiß!
Dadurch sehe ich nicht das eigentliche Hintergrundbild, sondern einheitlich grau im Textbereich (ergibt sich aus weiß + 50% durchsichtiges Schwarz).
Soweit zwar erklärbar, aber nicht das ich will.
Ich will den Textbereich ja durchsichtig/transparent haben
und nicht einheitlich grau
Was muss ich tun?
Vorschläge?
Wie gewünscht hier nachfolgend mein Code
test.html
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="tinymce.min.js"></script> </script> --> </head> <body background="rasen-hintergrund.jpg"> <h1>TinyMCE TEST</h1> <form method="post"> <textarea id="mytextarea">Hallo, Welt!</textarea> </form> <script> tinymce.init({ selector: "textarea", menubar: false, // removes the menubar statusbar: false, language: 'de', //size: height: 200, min_height: 100, max_height: 400, width: 850, min_width: 700, max_width: 1000, resize: 'both', plugins: [ "advlist autolink autosave link image lists charmap print preview hr anchor pagebreak spellchecker", "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking", "table contextmenu directionality emoticons template textcolor paste fullpage textcolor colorpicker textpattern" ], toolbar1: "newdocument fullpage | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | styleselect formatselect fontselect fontsizeselect", toolbar2: "cut copy paste | searchreplace | bullist numlist | outdent indent blockquote | undo redo | link unlink anchor image media code | insertdatetime preview | forecolor backcolor", toolbar3: "table | hr removeformat | subscript superscript | charmap emoticons | print fullscreen | ltr rtl | spellchecker | visualchars visualblocks nonbreaking template pagebreak restoredraft", body_class: "mceBlackBody", content_css: 'mytinymcestyle.css?' + new Date().getTime() }); </script> </body> </html>
mytinymcestyle.css
body.mceBlackBody { background: rgba(0,0,0,0.5); color:red; }
Beitrag zuletzt geändert: 25.2.2016 14:49:47 von dunkeltuten -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
