|
Дополнительные шрифты и цвета к BB-кодам на форум. JavaScript
|
|
| [1] SKh [08.02.2012, 13:17] |
Привет!
Давно меня вопрос мучает, а сейчас увидел что ты решил эту задачу!
Поискал у тебя на сайте инструкции - не нашел.
Как можно добавить шрифтов и цветов?
Вот такой комплект меня вполне удовлетворяет, т.к. есть мой любимый шрифт) (в списке последним): 
И этот комплект устраивает  но в него желательно добавить #F5FFF5 - цвет фона окна на форуме.
|
|
| [2] likbezz [08.02.2012, 23:18] |
SKh, Quote (SKh) Привет!
Давно меня вопрос мучает, а сейчас увидел что ты решил эту задачу!
Поискал у тебя на сайте инструкции - не нашел.
Как можно добавить шрифтов и цветов?
А скриншотики, как я понял, с моего форума сняты? )))
Сейчас напишу.
... |
|
| [3] SKh [08.02.2012, 23:38] |
Quote (likbezz)
А скриншотики, как я понял, с моего форума сняты? )))
Ну ясно дело!
Я честно об этом так и написал.)
Меня многие убеждали, что это невозможно на юкозе.
Что-то дернуло заглянуть как у тебя - и увидел, что возможно 
Сообщение отредактировал SKh - Среда, 08.02.2012, 23:40 |
|
| [4] likbezz [09.02.2012, 00:05] |
SKh,
Всё достаточно просто:
В шаблон «Форум, форма добавления» (в самый низ) добавляются следующие скрипты:
Для добавления списка шрифтов:
Code <script type="text/javascript">
function setFFamily(){
var obj=document.getElementById('ffont'),olen=obj.options.length;
var family=[['Verdana','Verdana'],['Tahoma','Tahoma'],['Georgia','Georgia'],['Palatino','Palatino Linotype'],['Monotype Corsiva','Monotype Corsiva']];
for(i=0,len=family.length;i<len;i++){
obj.options[olen]=new Option(family[i][0],family[i][1]);olen++;
};};
if(document.getElementById('ffont')){setFFamily();};
</script>
Где:
Quote var family=[['Verdana','Verdana'],['Tahoma','Tahoma'],['Georgia','Georgia'],['Palatino','Palatino Linotype'],['Monotype Corsiva','Monotype Corsiva']];
- массив добавляемых шрифтов, первое значение: - название - будет отображаться в выпадающем списке, второе значение - имя шрифта (полностью) - будет вписываться в bb-код.
И первое и второе значение - в кавычках.
... В принципе, всё.
Для добавления списка цветов:
Code <script type="text/javascript">
function setFColor(){
var obj=document.getElementById('fcolor'),olen=obj.options.length;
var colors=[['Розовый','#f1f'],['Коричневый','#630'],['Бордовый','#933'],['Салатовый','#3c6']];
for(i=0,len=colors.length;i<len;i++){
obj.options[olen]=new Option(colors[i][0],colors[i][1]);
obj.options[olen].setAttribute('style','color:'+colors[i][1]);
olen++;
};};
if(document.getElementById('fcolor')){setFColor();};
</script>
Где:
Quote var colors=[['Розовый','#f1f'],['Коричневый','#630'],['Бордовый','#933'],['Салатовый','#3c6']];
- массив добавляемых цветов, в котором: первое значение - имя/название цвета (любое) - будет отображаться в выпадающем списке; второе значение - точный код цвета (возможные значения HEX, RGB, Ключевое слово) - будет вписываться в bb-код и в цвет названия цвета в списке.
И первое и второе значение - в кавычках.
...
Список ограничен лишь разумными пределами.
... |
|
| [5] SKh [09.02.2012, 02:43] |
Спасибо!
Вставил таким образом:
Code <script type="text/javascript">
function setFFamily(){var obj=document.getElementById('ffont'),olen=obj.options.length;
var family=[['Verdana','Verdana'],['Tahoma','Tahoma'],['Georgia','Georgia'],['Palatino','Palatino Linotype'],['Monotype Corsiva','Monotype Corsiva']];
for(i=0,len=family.length;i<len;i++){obj.options[olen]=new Option(family[i][0],family[i][1]);olen++;};};
if(document.getElementById('ffont')){setFFamily();};
</script>
<script type="text/javascript">
function setFColor(){var obj=byId('fcolor'),olen=obj.options.length;
var colors=[['Розовый','#f1f'],['brown','#630'],['vinous','#933'],['lime','#3c6']["light","#F5FFF5"]];
for(i=0,len=colors.length;i<len;i++){obj.options[olen]=new Option(colors[i][0],colors[i][1]);
obj.options[olen].setAttribute('style','color:'+colors[i][1]);olen++;};};
if(document.getElementById('fcolor')){setFColor();};
</script>
Шрифты 
А вот у цветов где-то ошибка просочилась 
Что я сделал не так?
Убирал добавленный цвет - не работало
Перевел названия цветов - не работает
Сообщение отредактировал SKh - Четверг, 09.02.2012, 02:45 |
|
| [6] likbezz [09.02.2012, 03:13] |
SKh, Quote (SKh) var colors=[['Розовый','#f1f'],['brown','#630'],['vinous','#933'],['lime','#3c6']["light","#F5FFF5"]];
Запятой нету, между ['lime','#3c6'] и ["light","#F5FFF5"] ...
Вот так должно быть:
Quote var colors=[['Розовый','#f1f'],['brown','#630'],['vinous','#933'],['lime','#3c6'],['light','#F5FFF5']];
...
Quote (SKh) Перевел названия цветов - не работает
 Это типа, всё подряд пробуем)))
Названия цветом могут быть абсолютно произвольными - хоть с маленькой буквы, хоть латиницей, хоть кириллицей и тп..
... |
|
| [7] SKh [09.02.2012, 03:29] |
Сейчас вот так
Code <script type="text/javascript">
function setFColor(){var obj=byId('fcolor'),olen=obj.options.length;
var colors=[['pink','#f1f'],['brown','#630'],['vinous','#933'],['lime','#3c6'],["light","#F5FFF5"]];
for(i=0,len=colors.length;i<len;i++){obj.options[olen]=new Option(colors[i][0],colors[i][1]);
obj.options[olen].setAttribute('style','color:'+colors[i][1]);olen++;};};
if(document.getElementById('fcolor')){setFColor();};
</script>
Сообщение отредактировал SKh - Четверг, 09.02.2012, 03:30 |
|
| [8] likbezz [09.02.2012, 04:22] |
SKh, Quote (SKh) Сейчас вот так и все равно не добавилось
А, ну да ... У тебя же нет функции byId(); )))
Вот:
Code <script type="text/javascript">
function setFColor(){var obj=document.getElementById('fcolor'),olen=obj.options.length;
var colors=[['pink','#f1f'],['brown','#630'],['vinous','#933'],['lime','#3c6'],["light","#F5FFF5"]];
for(i=0,len=colors.length;i<len;i++){obj.options[olen]=new Option(colors[i][0],colors[i][1]);
obj.options[olen].setAttribute('style','color:'+colors[i][1]);olen++;};};
if(document.getElementById('fcolor')){setFColor();};
</script>
...
Мой косяк, ща поправлю) |
|
| [9] SKh [09.02.2012, 04:43] |
А что за функция byId(); ?
Ура-а-а!!!  Заработало 
Сообщение отредактировал SKh - Четверг, 09.02.2012, 04:48 |
|
| [10] likbezz [09.02.2012, 06:28] |
SKh, Quote (SKh) А что за функция byId(); ?
Сокращение для document.getElementById();
... |
|
| [11] Diana [24.07.2012, 17:13] |
likbezz, А как ты сделал спецсимволы? Прикольно 
Вот это:
И скажи пожалуйста - вот если у меня стандартные вв коды скрыты вообще
Code <span style="display: none;">$BBCODES$</span>
Вот такая конструкция же будет работать?
Вроде всё работает но что то сомневаюсь. Мало ли чего. У меня правда это в комментариях поставлено а не на форуме.
Code <span style="padding-right: 1px;">
<select name="fsize" class="codeButtons" onchange="alterfont(this.options[this.selectedIndex].value,'size','message','');this.selectedIndex=0; ">
<option value=0 selected>Размер шрифта</option>
<option value=6>6pt</option>
<option value=7>7pt</option>
<option value=8>8pt</option>
<option value=9>9pt</option>
<option value=10>10pt</option>
<option value=11>11pt</option>
<option value=12>12pt</option>
<option value=13>13pt</option>
<option value=14>14pt</option>
<option value=15>15pt</option>
<option value=16>16pt </option>
<option value=17>17pt </option>
<option value=18>18pt</option>
<option value=19>19pt </option>
<option value=20>20pt</option>
<option value=21>21pt</option>
<option value=22>22pt</option>
</select>
</span>
<span style="simpletag: 1px;">
<select name="ffont" class="codeButtons" onchange="alterfont(this.options[this.selectedIndex].value,'font','message','');this.selectedIndex=0; ">
<option value="0">Тип шрифта</option>
<option value="Arial">Arial</option>
<option value="Times">Times</option>
<option value="Courier">Courier</option>
<option value="Impact">Impact</option>
<option value="Geneva">Geneva</option>
<option value="Optima">Optima</option>
</select>
</span>
<span style="padding-right: 1px;">
<select name="fcolor" class="codeButtons" onchange="alterfont(this.options[this.selectedIndex].value, 'color','message','');this.selectedIndex=0;">
<option value=0 selected>Цвет текста</option>
<option style="COLOR: blue" value=blue>Синий</option>
<option style="COLOR: green" value=green>Зеленый</option>
<option style="COLOR: yellow" value=yellow>Желтый</option>
<option style="COLOR: red" value=red>Красный</option>
<option style="COLOR: purple" value=purple>Пурпурный</option>
<option style="COLOR: gray" value=gray>Серый</option>
<option style="COLOR: orange" value=orange>Оранжевый</option>
</select>
</span>
Сообщение отредактировал Diana - Вторник, 24.07.2012, 17:15 |
|
| [12] likbezz [24.07.2012, 17:29] |
Diana, А как ты сделал спецсимволы? Прикольно
Да я замучался вспоминать как они пишуться, и сделал страницу с таблицей символов.
Вставил скрытым ифреймом, на кнопку - событие - показать фрейм ...
В самой странице скрипт такой же как для вставки bb-кодов.
Мало ли чего. У меня правда это в комментариях поставлено а не на форуме.
Ну, думаю да, ID вроде нет, конфликта с name быть не должно .. по идее.
Лучше всего проверить) |
|
| [13] Diana [26.07.2012, 08:23] |
likbezz,
Quote Да я замучался вспоминать как они пишуться, и сделал страницу с таблицей символов.
Вставил скрытым ифреймом, на кнопку - событие - показать фрейм ...
В самой странице скрипт такой же как для вставки bb-кодов.
Я вот тоже пыталась раньше сделать,хотя бы для себя, потому что вечно забываю их, но я даже страницу такую с таблицей сделать не могу.
Они даже в code не отображаются текстом а ставятся просто символами.
Ты не мог бы как нибудь поподробней расписать как сделать? С примером страницы и скрипта?
При наличии времени конечно)
Я тут твою статью читаю Вот эту
Как выяснилось всё же можно сделать чтоб пользователи сами стиль поста выбирали - хоть и сложно.
Буду пробовать) Раз уж связалась с этими ВВ кодами - теперь придётся делать чтоб были приличные  Добавлено (26.07.2012, 08:23)
---------------------------------------------
likbezz,
Quote Вставил скрытым ифреймом, на кнопку - событие - показать фрейм ...
Как это сделать????
Почему у тебя это работает а у меня нет? 
Что там еще надо дописать для него?
Code <span id="mbc7"><input type="button" title="Спец. символы" class="codeButtons" onclick="_uMenu.show('simbol_c');" value="Simbol"><iframe id="simbol_c" src="/_theme1/_edit/bb/files/simbol.html" marginwidth="0" marginheight="0" style="visibility:hidden;display:none;position:absolute;width:177px;height:137px;" frameborder="0" scrolling="no"></iframe></span> |
|
| [14] likbezz [26.07.2012, 09:55] |
Diana,
Релативный спан должен быть .. ифрейм относительно спана, естественно.
...
Потому что все остальное - системные функции.
Это тоже системная. |
|
| [15] Diana [26.07.2012, 10:06] |
likbezz, Я ни слова не поняла.
Можно попроще. Типа для блондинок?
И это вообще можно сделать без PHP?
Сообщение отредактировал Diana - Четверг, 26.07.2012, 10:18 |
|