С помощью данного скрипта вы сможете добавить в форму быстрого ответа маленькую симпотичную формочку быстрых тегов. *Чтоб вас заинтересовало сразу привожу СКРИНШОТ.
Быстрые теги работают по очень удобному методу:[list][li]Вставляются на место курсора[/li][li]Если есть выделенный текст, то они обводят его.[/li][/list]Скрипт проверен в ИЕ, Mozilla, Opera. Думаю проблем особых не должно быть.
И так, преступим к установке.
1) Стиль.
В формочке используются название стандартных классов скина, но есть мелкое изменение для курсора:
АЦ-Скины/Шаблоны-Стиль-Редактировать.
Находим:
.row2 { background-color: #DFE6EF }
копируем, вставляем ниже, добавляем "x" в название, и 1 оператор. Выглядеть будет так:
.row2x { background-color: #DFE6EF;
cursor: pointer;
}
Повторяю:Код НЕ заменять, а добавлять ниже.[/u]
2) Форма.
АЦ-Скины/Шаблоны-HTML шаблоны-Настройка HTML-Topic View Section-quick_reply_box_open.
Находим:
<!-- TITLE DIV -->
<div class="tableborder">
<div class='maintitle'><{CAT_IMG}> {ibf.lang.qr_title}</div>
<div class="tablepad" align="center">
И после этого вставляем:
<!-- НОВЫЕ ТЕГИ!!!! -->
<table border=0><tr><td width=25%>
<table class= "tableborder" cellpadding= 5 cellspacing=1>
<tr class= "maintitle"><td colspan=3 align="center">Быстрые теги</td></tr>
<tr><td>
<table class= "tableborder" cellpadding= 5 cellspacing=1>
<tr class="row2x" align = "center"><td colspan=2 width = 33% onMouseOut="this.style.backgroundColor=''" onclick = "insTxt()" onmouseover = "copyT('B');this.style.backgroundColor='#EEF2F7'"><span><B>B</B></span></td><td colspan=2 width = 33% onMouseOut="this.style.backgroundColor=''" onclick = "insTxt()" onmouseover = "copyT('I');this.style.backgroundColor='#EEF2F7'"><span><I>I</I></span></td><td colspan=2 width = 33% onMouseOut="this.style.backgroundColor=''" onclick = "insTxt()" onmouseover = "copyT('U');this.style.backgroundColor='#EEF2F7'"><span><U>U</u></span></td></tr>
<tr class= "row2x" align = "center"><td colspan=2 onMouseOut="this.style.backgroundColor=''" onclick = "insTxt()" onmouseover = "copyT('URL');this.style.backgroundColor='#EEF2F7'"><span><U>URL</U></span></td><td colspan=2 onMouseOut="this.style.backgroundColor=''" onclick = "insTxt()" onmouseover = "copyT('IMG');this.style.backgroundColor='#EEF2F7'"><span><U>IMG</U></span></td><td colspan=2 onMouseOut="this.style.backgroundColor=''" onclick = "insTxt()" onmouseover = "copyT('HTML');this.style.backgroundColor='#EEF2F7'"><span><font size=2>HTML</font></span></td></tr>
<tr class="row2x" align = "center"><td colspan=2 onMouseOut="this.style.backgroundColor=''" onclick = "insTxt()" onmouseover = "copyT('QUOTE');this.style.backgroundColor='#EEF2F7'"><span>Quote</span></td><td colspan=2 onMouseOut="this.style.backgroundColor=''" onclick = "insTxt()" onmouseover = "copyT('CODE');this.style.backgroundColor='#EEF2F7'"><span>Code</span></td><td colspan=2 onMouseOut="this.style.backgroundColor=''" onclick = "insTxt()" onmouseover = "copyT('List');this.style.backgroundColor='#EEF2F7'"><span>List</span></td></tr>
<!--COLOR-->
<tr><td style="background-color:blue; cursor:pointer; height:10px" onmouseover = "copyTC('blue')" onclick = "insTxt()"></td>
<td style="background-color:purple; cursor:pointer" onmouseover = "copyTC('purple')" onclick = "insTxt()"></td>
<td style="background-color:brown; cursor:pointer" onmouseover = "copyTC('brown')" onclick = "insTxt()"></td>
<td style="background-color:orange; cursor:pointer" onmouseover = "copyTC('orange')" onclick = "insTxt()"></td>
<td style="background-color:red; cursor:pointer" onmouseover = "copyTC('red')" onclick = "insTxt()"></td>
<td style="background-color:green; cursor:pointer" onmouseover = "copyTC('green')" onclick = "insTxt()"></td>
</td></tr></table></td></tr>
</table></td><td width = 75%>
<textarea cols='70' rows='8' name='Post' class='textinput' tabindex="1" id="tex" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);" onfocus="storeCaret(this);"></textarea></td></tr></table>
ВНИМАНИЕ:
Приведенный код уже содержит текстареу со всем её "наворотами", то есть старую текстареу вы должны УДАЛИТЬ. Изначально она у вас выглядит примерно так:
<textarea cols='70' rows='8' name='Post' class='textinput' tabindex="1"></textarea>
3) Скрипт.
АЦ-Скины/Шаблоны-HTML шаблоны-Настройка HTML-Topic View Section-Header
Перед
//-->
</script>
Вставляем
[!--html--][/div]
HTML |
[!--html1--]function copyT(code) } function copyTC(cl) } function storeCaret(element) function insTxt() |
[div class='postcolor'][!--html3--]
Вот, и всё вроде.
UPDATE:
Делаем, чтоб при нажатии на CTRL+ENTER, срабатывала отправка быстрого ответа.
АЦ-Скины/Шаблоны-HTML Шаблоны-Настройка HTML-Topic View Section-quick_reply_box_open:
в самом начала после:
<script type="text/javascript">
<!--
вставляем:
document.onkeydown=function(e){
if (e) event=e
if ((event.keyCode==13)&&(event.ctrlKey)){
document.REPLIER.submit.click();
}}
Чтоб люди как-то знали, что оно работает, и этим можно пользоваться, можно написать неброско у кнопки "Отправить" (Ctrl+enter) к прмиеру серым цветом.
П.С. Если у вас не стандартный скин, и хотите подстроить под свой форум то:
Цвет, который в коде я выделил синим, это цвет из класса row3. То есть вы сможете зайти в свой стиль, посмотреть какой у вас там цвет, и заменить везде этот цвет на ваш.
Отредактировано Maslo (2006-01-09 01:46:44)
В чем тут может быть дело?
Если не трудно, посмотри текстовый прикрепленный файл (там код, который я в quick_reply_box_open разместил). Там все правильно? (В Header я вообще ничего не добавлял)
