Midas aktiviern?

fragnicht

Dabei seit: 03.08.2007

Beiträge: 127
#1

Midas aktiviern?

06.08.2007, 10:26

Moinsen

Bin immer noch bei einem Editor habe nur nen kleines Problemchen...

"MIDAS"

Habe mir schon die FF Beispiele an geguckt finde mich da aber nicht ganz durch, bzw. finde nicht das richtige!

Nämlich im IE contenteditable kein Problem

nur das ganze in FF will nicht so ich versuche derzeitig mit

<body onLoad(divEditable.contentWindow.document.contentD ocument.designMode="on">

(divEditanle so lautet die div ID)
//EDIT
Ich habe das ganze auch nicht im Iframe sonder alles auf einer Seite...
//EDIT-ENDE
was zustande zu bringen aber das will nicht so ganz habt Ihr da ne Idee oder nen winzigen Quellcode Ausschnitt?

THX 4 Posting back
greetz
Stichworte: -

Ambience

Dabei seit: 30.07.2007
Beiträge: 162

06.08.2007, 12:28

ich weiß net wie, was du vorhast.. ich habe auch mal kurzerhand so einen editor versucht zu schreiben, also ichs gelesen habe... mein ergebnis sah so aus, das du sehr browserspezifisch arbeiten musst.. sprich browserweichen habenmusst..

mein script sieht folgendermaßen aus:

Code:

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <title>Editor</title>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <script language="JavaScript" type="text/javascript">
    <!--
      var isMSIE = navigator.appName == "Microsoft Internet Explorer" ? true : false;
      var isFF = !document.all && document.getElementById && !this.isOpera;
 
      var isOpera = navigator.appName == "Opera" ? true : false;
      
      function Init()
      {      
        if (isMSIE)
        {
          iView.document.designMode = 'On';
        }
        else if (isFF)
        {
          document.getElementsByTagName('iframe')[0].contentDocument.designMode = "on";
        }
        else if (isOpera)
        {
        }
      }
      
      function selOver(ctrl)
      {
        ctrl.style.borderColor = '#000000';
        ctrl.style.backgroundColor = '#cbcbcb';
        ctrl.style.cursor = 'hand';
      }
      
      function selOut(ctrl)
      {
        ctrl.style.borderColor = '#D6D3CE';
        ctrl.style.backgroundColor = '#cccccc';
        ctrl.style.cursor = 'hand';
      }
      
      function selOn(ctrl) 
      { 
        ctrl.style.borderColor = '#000000'; 
        ctrl.style.backgroundColor = '#B5BED6'; 
        ctrl.style.cursor = 'hand'; 
      } 
      
      function boldIt() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('bold', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('bold', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
    //-->
    </script>
    <style type="text/css">
    <!--
    .butClass 
    { 
      border: 1px solid; 
      border-color: #D6D3CE; 
    } 
    -->
    </style>
  </head>
  <body onLoad="Init()">
    <table style="background-color: #d7d7d7;">
      <tr>
        <td onClick="boldIt();selOn(this);" onMouseOver="selOver(this);" onMouseOut="selOut(this);">B</td>
        <td onClick="italicsIt();selOn(this);" class="butClass" onMouseOver="">I</td>
        <td onClick="underlineIt();selOn(this);" class="butClass" onMouseOver="">U</td>
      </tr>
      <tr>
        <td style="background-color: #ffffff;" colspan="3"><iframe id="iView" style="width: 200px; height:70px"></iframe></td>
      </tr>
    </table>
  </body>
</html>

wie ich gerade gesehen habe, funktionieren meine "bbcodes" wieder mal nicht.. werde den editor evtl. mal die tage weitermachen...

Das mit dem Contenteditable hatte ich ausprobiert, hatte aber mit textareas bzw. divs nicht funktioniert, deshalb siehst du dort ein iframe.

Ambience

Ich gebe gerne ICQ-Support gegen ein kleines Endgelt.

Kommentar

fragnicht

Dabei seit: 03.08.2007

Beiträge: 127
#3

06.08.2007, 12:40

Juchu es geht habe bissl code von dir "geklaut" den für die Browserabfrage jetzt funktioniert mein Editor fast so wie er soll

Dankööö

ach ja mein dummer anfangsfehler onLoad() anstatt onLoad="" *nicht haun*

So dann bastel ich jetzt noch ein bissl dankööö an alle
Kommentar
LightApps

Dabei seit: 02.08.2007

Beiträge: 50
#4

06.08.2007, 16:09

Du könntest deinen Editor hier mal posten, wenn er fertg ist. sowas ist immer gut zu brauchen
Kommentar
fragnicht

Dabei seit: 03.08.2007

Beiträge: 127
#5

06.08.2007, 16:12

mmmh könnte nicht ganz gehen nur in der kleinen Version, aber die kann ich posten wenn es soweit fertig ist

Also son kleinen Abgespeckten da der Rest zu spezifisch sein wird
Kommentar

Ambience

Dabei seit: 30.07.2007
Beiträge: 162

06.08.2007, 22:28

Zuletzt geändert von Ambience; 06.08.2007, 22:30. Grund: edit angehängt.

dann post ich mal meinen... funktioniert noch nicht so ganz wie ich ihn will, aber bis jetzt tut er seinen zweck.. (Bilder können ab 23 Uhr von: http://www.all4php.de/php-bbcodes.rar runtergeladen werden):

Code:

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <title>Editor</title>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <script language="JavaScript" type="text/javascript">
    <!--
      var isMSIE = navigator.appName == "Microsoft Internet Explorer" ? true : false;
      var isFF = !document.all && document.getElementById && !this.isOpera;
 
      var isOpera = navigator.appName == "Opera" ? true : false;
 
      function Init()
      {      
        if (isMSIE)
        {
          iView.document.designMode = 'On';
        }
        else if (isFF)
        {
          document.getElementsByTagName('iframe')[0].contentDocument.designMode = "on";
        }
        else if (isOpera)
        {
        }
      }
 
      function MouseOver(ctrl)
      {
        ctrl.style.border = '1px solid #000000';
        ctrl.style.backgroundColor = '#cbcbcb';
        ctrl.style.cursor = 'hand';
      }
 
      function MouseOut(ctrl)
      {
        ctrl.style.border = '0px';
        ctrl.style.backgroundColor = '#d7d7d7';
        ctrl.style.cursor = 'hand';
      }
 
      function do_Bold() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('bold', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('bold', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_Italic() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('italic', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('italic', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_Underline() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('underline', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('underline', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_JustifyLeft() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('justifyleft', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('justifyleft', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_JustifyCenter() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('justifycenter', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('justifycenter', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_JustifyRight() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('justifyright', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('justifyright', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_InsertOrderedList() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('insertorderedlist', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('insertorderedlist', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_InsertUnOrderedList() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('insertunorderedlist', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('insertunorderedlist', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_OutDent() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('outdent', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('outdent', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_InDent() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('indent', false, null);
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('indent', false, null);
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_CreateLink() 
      { 
        if (isMSIE)
        {
          iView.document.execCommand('createlink');
          document.getElementById('iView').focus();
        }
        else if(isFF)
        {
         document.getElementById('iView').contentWindow.document.execCommand('createlink');
         document.getElementById('iView').contentWindow.focus();
        }
        else if (isOpera)
        {
        } 
      } 
 
      function do_InsertImage() 
      { 
        var imgSrc = prompt('Bitte Bild-Url eingeben', '');
 
        if (imgSrc != null)
        {
          if (isMSIE)
          {
            iView.document.execCommand('insertimage', false, imgSrc);
            document.getElementById('iView').focus();
          }
          else if(isFF)
          {
            document.getElementById('iView').contentWindow.document.execCommand('insertimage', false, imgSrc);;
            document.getElementById('iView').contentWindow.focus();
          }
          else if (isOpera)
          {
          }
        } 
      } 
    //-->
    </script>
  </head>
  <body onLoad="Init()">
    <table style="background-color: #d7d7d7;">
      <tr>
        <td><img src="bbcodes/bold.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_Bold();" /></td>
        <td><img src="bbcodes/italic.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_Italic();" /></td>
        <td><img src="bbcodes/underline.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_Underline();" /></td>
        <td><img src="bbcodes/separator.gif" /></td>
        <td><img src="bbcodes/justifyleft.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_JustifyLeft();" /></td>
        <td><img src="bbcodes/justifycenter.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_JustifyCenter();" /></td>
        <td><img src="bbcodes/justifyright.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_JustifyRight();" /></td>
        <td><img src="bbcodes/separator.gif" /></td>
        <td><img src="bbcodes/insertorderedlist.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_InsertOrderedList();" /></td>
        <td><img src="bbcodes/insertunorderedlist.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_InsertUnOrderedList();" /></td>
        <td><img src="bbcodes/outdent.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_OutDent();" /></td>
        <td><img src="bbcodes/indent.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_InDent();" /></td>
        <td><img src="bbcodes/separator.gif" /></td>
        <td><img src="bbcodes/createlink.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_CreateLink();" /></td>
        <td><img src="bbcodes/insertimage.gif" onMouseOver="MouseOver(this);" onMouseOut="MouseOut(this);" onClick="do_InsertImage();" /></td>
      </tr>
      <tr>
        <td style="background-color: #ffffff;" colspan="15"><iframe id="iView" style="width: 350px; height:150px"></iframe></td>
      </tr>
    </table>
  </body>
</html>

edit: kleine anmerkung... der code kann frei verwendet werden.. werde den editor nicht weiterentwickeln... find das langweilig...

Ich gebe gerne ICQ-Support gegen ein kleines Endgelt.

Kommentar

fragnicht

Dabei seit: 03.08.2007

Beiträge: 127
#7

06.08.2007, 22:37

Jo der sieht doch mal ganz schick aus

Was mir in Moment so auffällt und ich mir Gedanken drüber mache ist das speichern^^
Kommentar
Ambience

Dabei seit: 30.07.2007

Beiträge: 162
#8

06.08.2007, 22:53

das speichern ist das leichteste... onSubmit(..... und document.getElementById('iView').value

dass wars dann schon... dann bekommste sogar automatisch html code.

edit: bilder können jetzt geladen werden.

Ich gebe gerne ICQ-Support gegen ein kleines Endgelt.
Kommentar
fragnicht

Dabei seit: 03.08.2007

Beiträge: 127
#9

07.08.2007, 06:55

gut gut teste ich alles nachher dann bekommt ihr wie immer ne status meldung
Kommentar
Ambience

Dabei seit: 30.07.2007

Beiträge: 162
#10

07.08.2007, 10:46

vielen dank.. ich werde derweil, weil ich jetzt von dem editor besessen bin schauen ob ich ihn noch besser hinbekomme.

Ich gebe gerne ICQ-Support gegen ein kleines Endgelt.
Kommentar

Ankündigung

Midas aktiviern?

Neue Werbung 2019

Midas aktiviern?

Kommentar

Kommentar

Kommentar

Kommentar

Kommentar

Kommentar

Kommentar

Kommentar

Kommentar