login  Naam:   Wachtwoord: 
Registreer je!
 Forum

WYSIWYG-editor: standaard arial (Opgelost)

Offline Raze - 02/06/2009 13:52
Avatar van RazePHP beginner Ik heb deze tutorial gevolgd i.v.m. het maken van een WYSIWYG-editor: http://www.site...WYG_editor

Alles werkt, maar een tekst wordt (standaard) in Times New Roman weergegeven.
In de editor die ik heb gemaakt is het niet mogelijk om van font te veranderen (dit vond ik niet relevant voor hetgene waar ik deze voor wil gebruiken), maar ik wil dus dat het standaard in arial 10 wordt weergegeven.

Mijn code:
javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. <script language="javascript">
  2. function seteditFrame(){ 
  3.  if(window.navigator.appName == "Microsoft Internet Explorer") 
  4.   iframe.document.designMode = "on"; 
  5.  
  6.  if(window.navigator.appName == "Netscape") 
  7.   document.getElementById('iframe').contentDocument.designMode = "on"; 
  8. }
  9.  
  10. function bold() { 
  11.   document.getElementById("iframe").contentWindow.document.execCommand("bold", false, null); 
  12. } 
  13. function italic() { 
  14.   document.getElementById("iframe").contentWindow.document.execCommand("italic", false, null); 
  15. } 
  16. function underline() { 
  17.   document.getElementById("iframe").contentWindow.document.execCommand("underline", false, null); 
  18. } 
  19. function strikethrough() { 
  20.   document.getElementById("iframe").contentWindow.document.execCommand("strikethrough", false, null); 
  21. } 
  22. function subscript() { 
  23.   document.getElementById("iframe").contentWindow.document.execCommand("subscript", false, null); 
  24. } 
  25. function superscript() { 
  26.   document.getElementById("iframe").contentWindow.document.execCommand("superscript", false, null); 
  27. } 
  28.  
  29. function setList() { 
  30.   document.getElementById("iframe").contentWindow.document.execCommand("InsertUnorderedList", false, null); 
  31. } 
  32.  
  33. function makeLink() {
  34.  if(window.navigator.appName == "Microsoft Internet Explorer"){
  35.   document.getElementById("iframe").contentWindow.document.execCommand("createLink");
  36.  }else{
  37.   url = prompt("Voor de URL in:", "http://");
  38.  
  39.   document.getElementById("iframe").contentWindow.document.execCommand("createLink", false, url);
  40.  }
  41. }
  42. </script>

4 antwoorden

Gesponsorde links
Offline Wim - 02/06/2009 15:06
Avatar van Wim Crew algemeen http://www.site...G_editor#4

kan je die FontName en FontSize geen andere waarde geven bij een onload oid? Anders kan je het mss dmv css proberen?
Offline Raze - 02/06/2009 16:37 (laatste wijziging 02/06/2009 16:40)
Avatar van Raze PHP beginner css had ik al geprobeerd aan de iframe: font-family: arial; maar dat werkt niet  

Ook met FontName en FontSize had ik het al geprobeerd, maar ook daar lukte niets (met body=onLoad...).
Ik ga wel nog eens wat proberen met FontName en FontSize want ik denk toch dat het daar moet zitten, alhoewel:
je moet eerst en tekst typen, deze selecteren en dan kan je pas een handeling uitvoeren (bv bold). Je kan blijkbaar niet éérst op "bold" klikken en dan beginnen typpen in het vet, nee, je moet eerst tekst typen en dan pas de opmaak wijzigen. Daar zit het probleem dan ook volgens mij.

Edit: kheb volgende code:
javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. function setFont() { 
  2. var font = "arial";
  3. document.getElementById("iframe").contentWindow.document.execCommand("FontName", false, font); 
  4. }

en dan body onload... maar hij doet het dus niet   wat ik eig ook wel verwachtte.
Offline svm - 02/06/2009 19:03 (laatste wijziging 02/06/2009 19:07)
Avatar van svm PHP ver gevorderde
javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. function seteditFrame(){ 
  2.  if(window.navigator.appName == "Microsoft Internet Explorer") 
  3.   iframe.document.designMode = "on"; 
  4.  
  5.  if(window.navigator.appName == "Netscape") 
  6.   document.getElementById('iframe').contentDocument.designMode = "on"; 
  7. }


Je hebt dit stukje al als functie in de onload staan lijkt me (dit doe ik immers wel in de tutorial).
Hieraan vul de execCommand functie voor het lettertype en size (2 is dacht ik 10pt) toe en je krijgt:

javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. function seteditFrame(){ 
  2.  if(window.navigator.appName == "Microsoft Internet Explorer") 
  3.   iframe.document.designMode = "on"; 
  4.  
  5.  if(window.navigator.appName == "Netscape") 
  6.   document.getElementById('iframe').contentDocument.designMode = "on"; 
  7.  
  8.  document.getElementById("iframe").contentWindow.document.execCommand("FontName", false, "Arial");
  9. document.getElementById("iframe").contentWindow.document.execCommand("FontSize", false, 2);
  10.  
  11. }


And look: it works!
Offline Raze - 02/06/2009 19:10
Avatar van Raze PHP beginner Thnx  
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.195s