Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
PHP 5. На примерах. Авторы: Кузнецов М.В., Симдянов И.В., Голышев С.В. PHP Puzzles. Авторы: Кузнецов М.В., Симдянов И.В. PHP на примерах (2 издание). Авторы: Кузнецов М.В., Симдянов И.В. PHP 5/6. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. C++. Мастер-класс в задачах и примерах. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Визуальный редактор. Помогите плизз
 
 автор: Fighter   (20.03.2010 в 11:54)   письмо автору
 
 

Здравствуйте !
Пишу свой визуальный редактор, проблема со вставкой картинки в iframe и заменой цвета текста


<form action='11.php' method='POST' enctype='multipart/form-data'>


<script>
// ***********************
//  Выводим iframe и получаем доступ к нему
// ***********************
document.write("<input type='button' value='Ж' onclick='setTeg(\"bold\")' class='bold' />");
document.write("<input type='button' value='К' onclick='setTeg(\"italic\")' class='ital' />");
document.write("<input type='button' value='Ч' onclick='setTeg(\"underline\")' class='under' />");
document.write("<input type='button' value='images' onclick='setimage()' class='under' />");
document.write("<select> <option>Цвет</option> <option style=\"background:#000000\" onclick='setcolor(\"ForeColor\",\"000000\")'></option>  <option style=\"background:#FF0000\" onclick='setcolor(\"ForeColor\",\"FF0000\")'></option>   <option style=\"background:#00FF00\" onclick='setcolor(\"ForeColor\",\"00FF00\")'></option>      <option style=\"background:#0000FF\" onclick='setcolor(\"ForeColor\",\"0000FF\")'></option></select> ");
document.write("<input type='button' value='Код' onclick='showcode()' class='code' /><br>");

// Выводим в HTML-поток iframe
document.write("<iframe frameborder='yes' scrolling='yes' width=600  src='#' id='frameId' name='frameId'></iframe><br/>");

// Определим Gecko-браузеры, т.к. они отличаются в своей работе от Оперы и IE
var isGecko = navigator.userAgent.toLowerCase().indexOf("gecko") != -1;
// Получаем доступ к объектам window & document для ифрейма
var iframe = (isGecko) ? document.getElementById("frameId") : frames["frameId"];
var iWin = (isGecko) ? iframe.contentWindow : iframe.window;
var iDoc = (isGecko) ? iframe.contentDocument : iframe.document;


// ***********************
// Добавим на пустую страницу ифрейма произвольный HTML-код
// ***********************

// Формируем HTML-код
iHTML = "<html><head>\n";
iHTML += "<style>\n";
iHTML += "body, div, p, td {font-size:12px; font-family:tahoma; margin:0px; padding:0px;}";
iHTML += "body {margin:5px;}";
iHTML += "</style>\n";
iHTML += "<body></body>";
iHTML += "</html>";
// Добавляем его с помощью методов объекта document
iDoc.open();
iDoc.write(iHTML);
iDoc.close();


// ***********************
// Инициализация свойства designMode объекта document
// ***********************

if (!iDoc.designMode) alert("Визуальный режим редактирования не поддерживается Вашим браузером");
else iDoc.designMode = (isGecko) ? "on" : "On";

// Запишем код функции, для выставления форматирования
// Используется метод execCommand объекта document


                        
function setimage() {

iWin.focus();
iWin.document.execCommand('InsertImage', 1);
}


function setTeg(x) {

iWin.focus();
iWin.document.execCommand(x, null, "");
}

function setcolor(z,c) {
    iWin.focus();
    iWin.document.execCommand(z, null, c);
}

function showcode() {
alert (document.getElementById("frameId").contentWindow.document.body.innerHTML);
}


</script>
<input type='button' onclick="" name='ok' value="OK"><br>
<input name="op" type="hidden" value="">
</form>




Картинка только в IE вроде как вставляется но не отображается, в Firefox не работает вобще, как поправить что бы работала везде ?
И цвет, только в Firefox изменяется а в IE нет. Помогите кто сможет !

  Ответить  
 
 автор: elenaki   (20.03.2010 в 17:23)   письмо автору
14.3 Кб
 
   для: Fighter   (20.03.2010 в 11:54)
 

execCommand - это работает только в IE

возьмите вот это. там все есть

  Ответить  
 
 автор: sasha1133   (21.03.2010 в 13:14)   письмо автору
 
   для: elenaki   (20.03.2010 в 17:23)
 

Спасибо, мне тоже пригодилось))

А вот я думаю сделать визуальный редактор на флэше. Чтобы просто вставлять swf в страницу. По моему должно получится кроссбраузерно, да? А то эти разногласия в JavaScript очень уж достали. Когда уже W3C до них доберётся))

  Ответить  
 
 автор: yuk   (21.03.2010 в 19:44)   письмо автору
 
   для: elenaki   (20.03.2010 в 17:23)
 

>>execCommand - это работает только в IE
На самом деле работает не только в IE. Даже не знаю, в чем оно не работает.
Используется во всех визуальных редакторах, которые я встречал. В том числе и в ArthEdit.

  Ответить  
 
 автор: elenaki   (22.03.2010 в 20:54)   письмо автору
 
   для: yuk   (21.03.2010 в 19:44)
 

http://webew.ru/articles/192.webew

Форматирование содержимого в пределах ВИСИВИГа осуществляется с помощью непростого метода execCommand, реализация которого сильно различается от браузера к браузеру.


===============================
от ArthEdit'a я в свое время отказалась именно потому, что он не работал в FF, а клиенты
(чаще всего - ламеры из ламеров) требовали только его (FF). ненавижу.

  Ответить  
 
 автор: yuk   (23.03.2010 в 00:03)   письмо автору
 
   для: elenaki   (22.03.2010 в 20:54)
 

Реализация которого сильно различается от браузера к браузеру - это не значит, что работает только в IE.

>>от ArthEdit'a я в свое время отказалась именно потому, что он не работал в FF
На ArthEdit я сделал акцент только потому, что именно его вы предлагаете взамен использования execCommand. Что, на мой взгляд, не логично.

PS
Почти на 100% уверен, что тот визуальный редактор, который вы используете сейчас - тоже основан на методе execCommand. (конечно, если это не какой-нибудь flash)

  Ответить  
 
 автор: sasha1133   (23.03.2010 в 01:55)   письмо автору
 
   для: yuk   (23.03.2010 в 00:03)
 

А какие уже существуют flash редакторы (платные и бесплатные)? Как платные редакторы "защищаются" от бесплатного копирования?) Просто есть мысль сделать флэш-редактор, и распространять его. Ещё не решил что лучше - добровольные пожертвования, или сделать платным.

  Ответить  
 
 автор: yuk   (23.03.2010 в 09:54)   письмо автору
 
   для: sasha1133   (23.03.2010 в 01:55)
 

Вот - http://etcs.ru/files/WYSIWYG_editor.zip
тут идет описание создания редактора на flash (ссылка взята из http://www.flasher.ru/forum/showthread.php?t=89822)

там же ссылка на платный есть -
http://www.flashloaded.com/flashcomponents/flashtexteditor/example1.html

ну, и, как говориться - гугл рулит.

  Ответить  
 
 автор: elenaki   (25.03.2010 в 09:11)   письмо автору
 
   для: yuk   (23.03.2010 в 00:03)
 

тоже основан на методе execCommand
====================================
нет
но он гораздо тяжелее

  Ответить  
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования